Cách thay đổi Nội dung của <textarea> bằng Javascript

139

Làm cách nào để thay đổi nội dung của một <textarea>phần tử bằng JavaScript?

Tôi muốn làm cho nó trống rỗng.

javascript

— ian
nguồn

244

Như thế này:

document.getElementById('myTextarea').value = '';

hoặc như thế này trong jQuery:

$('#myTextarea').val('');

Ở đâu mà bạn có

<textarea id="myTextarea" name="something">This text gets removed</textarea>

Đối với tất cả những người downvoters và những người không tin:

Đây là tài liệu tham khảo MSDN

value Thuộc tính: Lấy hoặc đặt văn bản trong trường nhập của phần tử textArea.
Đây là tài liệu tham khảo MDN

value DOMString Giá trị thô chứa trong điều khiển.

— Greg
nguồn

Không nghĩ rằng giá trị sẽ làm việc vì không có. giá trị = trong đó nhưng cảm ơn!

— ian

1

không hoạt động trong trình duyệt internet explorer trên thiết bị di động windows.

— Paul

9

không hoạt động với chrome v61, giá trị không ảnh hưởng trong hộp đầu vào

— Aero Wang

15

Nếu bạn có thể sử dụng jQuery và tôi thực sự khuyên bạn nên làm, bạn chỉ cần làm

$('#myTextArea').val('');

Nếu không, nó phụ thuộc vào trình duyệt. Giả sử bạn có

var myTextArea = document.getElementById('myTextArea');

Trong hầu hết các trình duyệt bạn làm

myTextArea.innerHTML = '';

Nhưng trong Firefox, bạn làm

myTextArea.innerText = '';

Tìm hiểu xem trình duyệt nào người dùng đang sử dụng là một bài tập cho người đọc. Trừ khi bạn sử dụng jQuery, tất nhiên;)

Chỉnh sửa : Tôi lấy lại. Có vẻ như sự hỗ trợ cho .innerHTML trên textarea đã được cải thiện. Tôi đã thử nghiệm trong Chrome, Firefox và Internet Explorer, tất cả chúng đều xóa chính xác văn bản.

Chỉnh sửa 2 : Và tôi vừa kiểm tra, nếu bạn sử dụng .val ('') trong jQuery, nó chỉ đặt thuộc tính .value cho textarea. Vì vậy, giá trị sẽ tốt.

— Aistina
nguồn

3

.value = ''; hoạt động trong Chrome FF và Safari ... .innerHTML không hoạt động trong Chrome không thử nghiệm ở những người khác.

— ian

1

Bạn không nên sử dụng InternalHTML và InternalText cho textareas. Các thuộc tính giá trị nên được sử dụng. Vì vậy, $ ('# myTextArea'). Val ('') hoặc document.getEuityById ('myTextArea'). Value = '' là lựa chọn tốt nhất

— Parth

8

Mặc dù nhiều câu trả lời đúng đã được đưa ra, cách tiếp cận cổ điển (đọc không phải DOM) sẽ như sau:

document.forms['yourform']['yourtextarea'].value = 'yourvalue';

trong HTML trong văn bản của bạn được lồng ở đâu đó trong một hình thức như thế này:

<form name="yourform">
    <textarea name="yourtextarea" rows="10" cols="60"></textarea>
</form>

Và khi điều đó xảy ra, điều đó cũng sẽ hoạt động với Netscape Navigator 4 và Internet Explorer 3. Và, không quan trọng, Internet Explorer trên thiết bị di động.

— Paul
nguồn

2

Nếu Jquery của nó ..

$("#myText").val('');

hoặc là

document.getElementById('myText').value = '';

http://www.hscripts.com/tutorials/javascript/dom/textarea-events.php

— TigerTiger
nguồn

2

đặt textarea vào một biểu mẫu, đặt tên cho chúng và chỉ cần sử dụng các đối tượng dom một cách dễ dàng, như thế này:

<body onload="form1.box.value = 'Welcome!'">
  <form name="form1">
    <textarea name="box"></textarea>
  </form>
</body>

— Shrdi
nguồn