So ändern Sie den Inhalt eines <Textbereichs> mit Javascript

139

Wie würde ich den Inhalt eines <textarea>Elements mit JavaScript ändern ?

Ich möchte es leer machen.

javascript Ian
quelle

Antworten:

244

So was:

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

oder so in jQuery:

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

Wo du hast

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

Für alle Downvoter und Ungläubigen:

Greg
quelle
Ich hätte nicht gedacht, dass Wert funktionieren würde, weil es keinen gibt. value = drin aber danke!
ian
1
funktioniert nicht im Internet Explorer auf Windows Mobile-Geräten.
Paul
9
funktioniert nicht mit Chrome V61, der Wert wirkt sich nicht auf das Eingabefeld aus
Aero Wang
15

Wenn Sie jQuery verwenden können, und ich empfehle Ihnen dringend, dies zu tun, würden Sie dies einfach tun

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

Ansonsten ist es browserabhängig. Vorausgesetzt, Sie haben

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

In den meisten Browsern tun Sie dies

myTextArea.innerHTML = '';

Aber in Firefox tun Sie das

myTextArea.innerText = '';

Das Herausfinden, welchen Browser der Benutzer verwendet, bleibt dem Leser als Übung. Es sei denn, Sie verwenden natürlich jQuery;)

Edit : Ich nehme das zurück. Die Unterstützung für .innerHTML in Textbereichen scheint sich verbessert zu haben. Ich habe in Chrome, Firefox und Internet Explorer getestet, alle haben den Textbereich korrekt gelöscht.

Bearbeiten 2 : Und ich habe gerade überprüft, ob Sie .val ('') in jQuery verwenden, es setzt nur die .value-Eigenschaft für Textbereiche. Der Wert sollte also in Ordnung sein.

Aistina
quelle
3
.value = ''; funktioniert in Chrome FF und Safari ... .innerHTML funktioniert nicht in Chrome wurde in anderen nicht getestet.
ian
1
Sie sollten innerHTML und innerText nicht für Textbereiche verwenden. Das value-Attribut sollte verwendet werden. Also ist $ ('# myTextArea'). Val ('') oder document.getElementById ('myTextArea'). Value = '' die beste Option
Parth
8

Obwohl bereits viele richtige Antworten gegeben wurden, würde der klassische Ansatz (Nicht-DOM lesen) folgendermaßen aussehen:

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

Wo im HTML Ihr Textbereich irgendwo in einer Form wie dieser verschachtelt ist:

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

Und das würde natürlich auch mit Netscape Navigator 4 und Internet Explorer 3 funktionieren . Und nicht unwichtig, Internet Explorer auf Mobilgeräten.

Paul
quelle
2

Fügen Sie den Textbereich in ein Formular ein, benennen Sie ihn und verwenden Sie die dom-Objekte einfach wie folgt:

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