Come modificare il contenuto di una <textarea> con Javascript

139

Come cambierei il contenuto di un <textarea>elemento con JavaScript?

Voglio renderlo vuoto.

javascript

— ian
fonte

244

Come questo:

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

o come questo in jQuery:

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

Dove hai

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

Per tutti i downvoter e i non credenti:

Ecco il riferimento MSDN

Proprietà value: recupera o imposta il testo nel campo di immissione dell'elemento textArea.
Ecco il riferimento MDN

valore DOMString Il valore non elaborato contenuto nel controllo.

— Greg
fonte

Non pensavo che il valore avrebbe funzionato perché non c'è. valore = in esso, ma grazie!

— ian,

1

non funziona in Internet Explorer su dispositivi mobili Windows.

— Paul,

9

non funziona con Chrome V61, il valore non ha effetto nella casella di input

— Aero Wang

15

Se puoi usare jQuery e ti consiglio vivamente di farlo, lo faresti semplicemente

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

Altrimenti, dipende dal browser. Supponendo che tu abbia

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

Nella maggior parte dei browser lo fai

myTextArea.innerHTML = '';

Ma in Firefox, lo fai

myTextArea.innerText = '';

Capire quale browser sta utilizzando l'utente viene lasciato come esercizio per il lettore. A meno che tu non usi jQuery, ovviamente;)

Modifica : lo riprendo. Sembra che il supporto per .innerHTML su textarea sia migliorato. Ho testato su Chrome, Firefox e Internet Explorer, tutti hanno cancellato correttamente l'area di testo.

Modifica 2 : E ho appena controllato, se si utilizza .val ('') in jQuery, imposta semplicemente la proprietà .value per textarea. Quindi .value dovrebbe andare bene.

— Aistina
fonte

3

.value = ''; funziona in Chrome FF e Safari ... .innerHTML non funziona in Chrome non testato in altri.

— ian,

1

Non dovresti usare innerHTML e innerText per textareas. L'attributo value dovrebbe essere usato. Quindi, $ ('# myTextArea'). Val ('') o document.getElementById ('myTextArea'). Value = '' è l'opzione migliore

— Parth

8

Sebbene siano già state fornite molte risposte corrette, l'approccio classico (leggi non DOM) sarebbe come questo:

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

dove in HTML la tua textarea è nidificata da qualche parte in una forma come questa:

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

E come succede, funzionerebbe anche con Netscape Navigator 4 e Internet Explorer 3. E, non irrilevante, Internet Explorer su dispositivi mobili.

— Paolo
fonte

2

Se è Jquery ..

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

o

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

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

— Tiger Tiger
fonte

2

metti la textarea in una maschera, nominandola, e usa semplicemente gli oggetti dom facilmente, come questo:

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

— Shrdi
fonte