Hướng dẫn how to change div content on button onclick using javascript - cách thay đổi nội dung div trên nút onclick bằng javascript

Tôi đang cố gắng sử dụng hộp văn bản và nút gửi để thay đổi div trên trang. Tôi muốn lấy văn bản đã được gõ vào hộp văn bản và đặt nó vào Div khi nhấp vào nút. Tôi có mã này:

function myfunction() { 
    var myText = document.getElementById("textbox").value;
    document.getElementById('myDiv').innerHTML = myText;
 } 

Nhưng không có gì xảy ra. Khi tôi thử nó trong trình duyệt, nó chỉ cần làm mới trang và thêm ?textbox=someValueHere vào cuối URL. Làm cách nào để div hiển thị giá trị hộp văn bản?

Hướng dẫn how to change div content on button onclick using javascript - cách thay đổi nội dung div trên nút onclick bằng javascript

Barmar

703K53 Huy hiệu vàng472 Huy hiệu bạc584 Huy hiệu đồng53 gold badges472 silver badges584 bronze badges

Hỏi ngày 30 tháng 4 năm 2015 lúc 19:29Apr 30, 2015 at 19:29

5

Vấn đề là nút gửi đang đăng biểu mẫu, vì vậy bạn không thấy thay đổi - nếu bạn thay đổi nút gửi của mình thành nút bình thường, nó sẽ hoạt động

 

Đã trả lời ngày 30 tháng 4 năm 2015 lúc 19:34Apr 30, 2015 at 19:34

DashsadashsaDashsa

7188 Huy hiệu bạc18 Huy hiệu đồng8 silver badges18 bronze badges

9

Biểu mẫu đang gửi. Bạn cần dừng điều đó bằng cách thêm trả về sai; (nếu bạn đang sử dụng jQuery) hoặc xóa biểu mẫu hoàn toàn không bắt buộc.

function myfunction() { 
    var myText = document.getElementById("textbox").value;
    document.getElementById('myDiv').innerHTML = myText;
    return false;
 } 

Đã trả lời ngày 30 tháng 4 năm 2015 lúc 19:34Apr 30, 2015 at 19:34

User970008User970008User970008

Dashsadashsa3 gold badges20 silver badges49 bronze badges

7188 Huy hiệu bạc18 Huy hiệu đồng

Biểu mẫu đang gửi. Bạn cần dừng điều đó bằng cách thêm trả về sai; (nếu bạn đang sử dụng jQuery) hoặc xóa biểu mẫu hoàn toàn không bắt buộc.Apr 30, 2015 at 19:33

Hướng dẫn how to change div content on button onclick using javascript - cách thay đổi nội dung div trên nút onclick bằng javascript

1.1153 huy hiệu vàng20 Huy hiệu bạc49 Huy hiệu đồngSterling Archer

Không có gì xảy ra vì hình thức đang được gửi. Bạn cần ngăn chặn hành động mặc định xảy ra, đó là đệ trình biểu mẫu. Xem preventDefault() hoặc return false trong MDN để biết thêm chi tiết về cách ngăn chặn hành động mặc định của sự kiện xảy ra.17 gold badges80 silver badges116 bronze badges

2

Đã trả lời ngày 30 tháng 4 năm 2015 lúc 19:33

function myfunction(e) { 
    e.preventDefault();
    var myText = document.getElementById("textbox").value;
    document.getElementById('myDiv').innerHTML = myText;
 } 


Biểu mẫu đang gửi. Bạn cần dừng điều đó bằng cách thêm trả về sai; (nếu bạn đang sử dụng jQuery) hoặc xóa biểu mẫu hoàn toàn không bắt buộc.Apr 30, 2015 at 19:33

1.1153 huy hiệu vàng20 Huy hiệu bạc49 Huy hiệu đồngBarmar

703K53 Huy hiệu vàng472 Huy hiệu bạc584 Huy hiệu đồng53 gold badges472 silver badges584 bronze badges

0

JavaScript Thay thế nội dung div onclick một nút bằng ví dụ mã

Xin chào tất cả mọi người, trong bài đăng này, chúng tôi sẽ xem xét cách giải JavaScript Thay thế nội dung div onclick một nút trong lập trình.

Hướng dẫn how to change div content on button onclick using javascript - cách thay đổi nội dung div trên nút onclick bằng javascript

Như chúng ta đã thấy, JavaScript thay thế nội dung div onclick một vấn đề nút đã được giải quyết bằng cách sử dụng một số trường hợp khác nhau.

Làm cách nào để thay đổi nội dung trên nhấp chuột?

Nếu bạn cần thay đổi nút HTML bên trong, hãy sử dụng thuộc tính bên trong thay vì TextContent. Để thay đổi văn bản của một nút trên nhấp chuột:

  • Thêm một trình nghe sự kiện nhấp vào nút.
  • Sử dụng thuộc tính TextContent để thay đổi văn bản nút.
  • Ví dụ, BTN. TextContent = ‘nút nhấp chuột.

Làm cách nào để thay thế một div bằng một div bằng một div khác?

const main = tài liệu. getEuityByid (’chính); const gốc = tài liệu. getEuityByid (‘hoạt động1,); const clone = bản gốc. Cách tốt nhất để làm điều này sẽ là:

  • Bản sao đầu tiên Div mong muốn.
  • Thứ hai trống rỗng div chính.
  • Thứ ba nối các bản sao vào Div chính.

Tôi có thể sử dụng onclick trên div không?

Chúng ta có thể liên kết một chức năng JavaScript với DIV bằng cách sử dụng trình xử lý sự kiện Onclick trong HTML hoặc gắn trình xử lý sự kiện trong JavaScript. Hãy để chúng tôi tham khảo mã sau trong đó chúng tôi đính kèm trình xử lý sự kiện vào một phần tử DIV. Phần tử div không chấp nhận bất kỳ sự kiện nhấp nào theo mặc định.31-tháng 10-2021

Làm thế nào để tôi chuyển đổi giữa các div?

Để chuyển đổi khả năng hiển thị div trong jQuery, hãy sử dụng phương thức chuyển đổi (). Nó kiểm tra phần tử div cho khả năng hiển thị, tức là phương thức show () nếu div bị ẩn. Và id () id phần tử div có thể nhìn thấy. Điều này cuối cùng tạo ra một hiệu ứng chuyển đổi.17-feb-2020

Làm cách nào để thay đổi văn bản nút?

Để thay đổi văn bản nút, trước tiên chúng ta cần truy cập phần tử nút bên trong JavaScript bằng cách sử dụng tài liệu. phương thức getEuityById () và thêm trình xử lý sự kiện nhấp vào nút, sau đó đặt thuộc tính giá trị của nó thành màu xanh lam. Bây giờ, khi chúng tôi nhấp vào nút của mình, nó thay đổi giá trị từ đỏ sang màu xanh hoặc ngược lại.10-APR-2021

Làm cách nào để thay đổi văn bản của một nút trong CSS?

HTML, CSS và JavaScript Để thay đổi kích thước phông chữ của nút, sử dụng thuộc tính kích thước phông chữ.24-Jun-2020

Làm thế nào để bạn sao chép nội dung của một div vào div khác bằng jQuery?

Đầu tiên, chọn phần tử div cần được sao chép vào một phần tử div khác. Chọn phần tử đích nơi phần tử div được sao chép. Sử dụng phương thức appendto () để sao chép phần tử là con của nó.03-Jun-2022

Được sử dụng để thay thế nội dung phần tử trong JavaScript?

Sử dụng JavaScript, cách tiếp cận phổ biến nhất để thay thế nội dung bên trong một phần tử là bằng thuộc tính bên trong. Ngoài ra, bạn có thể sử dụng TextContent để đặt nội dung văn bản phần tử, được coi là an toàn chống lại các cuộc tấn công XSS.

Làm cách nào để chuyển giá trị từ div này sang div khác trên cùng một trang?

JavaScript Sao chép nội dung phần tử Div

  • chức năng copyToclipboard (containerId) {
  • VAR Range = Document. createrange ();
  • phạm vi. selectNode (tài liệu. getEuityById (containerId));
  • cửa sổ. getSelection (). removeallranges (phạm vi);
  • cửa sổ.getSelection ().
  • tài liệu.ExecCommand (bản sao bản sao);
  • cảnh báo (văn bản của người Viking được sao chép vào clipboard);
  • }

Làm cách nào để thực hiện một phần tử div có thể nhấp?

Chúng tôi chỉ cần thêm sự kiện Onlcick và thêm một vị trí vào nó.Sau đó, tất cả và tùy chọn, chúng tôi thêm một con trỏ: con trỏ để chỉ ra cho người dùng div có thể nhấp.Điều này sẽ làm cho toàn bộ Div Click có thể nhấp.04-Dec-2014