Cómo cambiar el contenido de un <textarea> con Javascript

139

¿Cómo cambiaría el contenido de un <textarea>elemento con JavaScript?

Quiero dejarlo vacío.

javascript

— ian
fuente

244

Me gusta esto:

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

o así en jQuery:

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

Donde tienes

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

Para todos los votantes negativos y no creyentes:

Aquí está la referencia de MSDN

Propiedad value: recupera o establece el texto en el campo de entrada del elemento textArea.
Aquí está la referencia de MDN

value DOMString El valor bruto contenido en el control.

— Greg
fuente

No pensé que el valor funcionaría porque no hay. valor = en él pero gracias!

— ian

1

no funciona en Internet Explorer en dispositivos móviles con Windows.

— Paul

9

no funciona con Chrome v61, el valor no afecta el que está en el cuadro de entrada

— Aero Wang

15

Si puede usar jQuery, y le recomiendo que lo haga, simplemente lo haría

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

De lo contrario, depende del navegador. Asumiendo que tienes

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

En la mayoría de los navegadores lo haces

myTextArea.innerHTML = '';

Pero en Firefox, lo haces

myTextArea.innerText = '';

Averiguar qué navegador está utilizando el usuario se deja como ejercicio para el lector. A menos que use jQuery, por supuesto;)

Editar : Retiro eso. Parece que el soporte para .innerHTML en textarea ha mejorado. Probé en Chrome, Firefox e Internet Explorer, todos borraron el área de texto correctamente.

Edición 2 : y acabo de marcar, si usa .val ('') en jQuery, solo establece la propiedad .value para el área de texto. Entonces .value debería estar bien.

— Aistina
fuente

3

.value = ''; funciona en Chrome FF y Safari ... .innerHTML no funciona en Chrome no probó en otros.

— ian

1

No debe usar innerHTML e innerText para áreas de texto. Se debe usar el atributo de valor. Entonces, $ ('# myTextArea'). Val ('') o document.getElementById ('myTextArea'). Value = '' es la mejor opción

— Parth

8

Aunque ya se han dado muchas respuestas correctas, el enfoque clásico (leer sin DOM) sería así:

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

donde en el HTML su área de texto está anidada en algún lugar de una forma como esta:

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

Y como sucede, eso también funcionaría con Netscape Navigator 4 e Internet Explorer 3. Y, no sin importancia, Internet Explorer en dispositivos móviles.

— Pablo
fuente

2

Si es Jquery ..

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

o

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

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

— Tigre
fuente

2

coloque el área de texto en un formulario, nombrándolos, y simplemente use los objetos dom fácilmente, de esta manera:

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

— Shrdi
fuente