Cara mengubah Konten <textarea> dengan Javascript

139

Bagaimana cara saya mengubah konten <textarea>elemen dengan JavaScript?

Saya ingin membuatnya kosong.

javascript ian
sumber

Jawaban:

244

Seperti ini:

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

atau seperti ini di jQuery:

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

Di mana Anda memiliki

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

Untuk semua downvoters dan kafir:

Greg
sumber
Tidak mengira nilai akan berhasil karena tidak ada. nilai = di dalamnya tetapi terima kasih!
ian
1
tidak bekerja di internet explorer di perangkat windows mobile.
Paul
9
tidak bekerja dengan chrome v61, nilainya tidak mempengaruhi yang ada di kotak input
Aero Wang
15

Jika Anda dapat menggunakan jQuery, dan saya sangat menyarankan Anda melakukannya, Anda cukup melakukannya

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

Kalau tidak, itu tergantung pada browser. Dengan asumsi Anda punya

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

Di sebagian besar browser, Anda melakukannya

myTextArea.innerHTML = '';

Tetapi di Firefox, Anda lakukan

myTextArea.innerText = '';

Mencari tahu browser apa yang digunakan pengguna dibiarkan sebagai latihan untuk pembaca. Kecuali Anda menggunakan jQuery, tentu saja;)

Sunting : Saya ambil kembali. Sepertinya dukungan untuk .innerHTML pada textarea telah membaik. Saya menguji di Chrome, Firefox dan Internet Explorer, semuanya membersihkan textarea dengan benar.

Sunting 2 : Dan saya baru saja memeriksa, jika Anda menggunakan .val ('') di jQuery, itu hanya mengatur properti .value untuk textarea. Jadi. Nilai harus baik-baik saja.

Aistina
sumber
3
.value = ''; berfungsi di Chrome FF dan Safari ... .innerHTML tidak berfungsi di Chrome tidak menguji yang lain.
ian
1
Anda seharusnya tidak menggunakan innerHTML dan innerText untuk textareas. Atribut nilai harus digunakan. . Jadi, $ ( '# myTextArea') val ( '') atau document.getElementById ( 'myTextArea'). Value = '' adalah pilihan terbaik
Parth
8

Meskipun banyak jawaban yang benar telah diberikan, pendekatan klasik (baca non-DOM) akan seperti ini:

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

di mana dalam HTML, teks Anda bersarang di suatu tempat dalam bentuk seperti ini:

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

Dan seperti yang terjadi, itu akan bekerja dengan Netscape Navigator 4 dan Internet Explorer 3 juga. Dan, tidak penting, Internet Explorer di perangkat seluler.

Paul
sumber
2

letakkan textarea ke formulir, beri nama, dan cukup gunakan objek dom dengan mudah, seperti ini:

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