Як змінити вміст <textarea> за допомогою Javascript

139

Як я можу змінити вміст <textarea>елемента за допомогою JavaScript?

Я хочу зробити це порожнім.

javascript

— Ян
джерело

244

Подобається це:

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

або подібне у jQuery:

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

Де у вас є

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

Для всіх прихильників та невіруючих:

Ось посилання на MSDN

value властивість: Вилучає або встановлює текст у полі введення елемента textArea.
Ось посилання на MDN

значення DOMString Сире значення, що міститься в контролі.

— Грег
джерело

Не думав, що цінність спрацює, тому що немає. value = в цьому, але дякую!

— Ян

1

не працює в Internet Explorer на мобільних пристроях Windows.

— Павло

9

не працює з chrome v61, значення не впливає на поле введення

— Aero Wang

15

Якщо ви можете використовувати jQuery, і я дуже рекомендую вам це зробити, ви просто зробите це

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

В іншому випадку це залежить від браузера. Припустимо, що у вас є

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

У більшості браузерів, які ви робите

myTextArea.innerHTML = '';

Але в Firefox ви це робите

myTextArea.innerText = '';

З'ясування того, який браузер користувач використовує, залишається вправою для читача. Якщо ви, звичайно, не використовуєте jQuery;)

Редагувати : я повертаю це назад. Схоже, покращилася підтримка .innerHTML на textarea. Я перевірив Chrome, Firefox та Internet Explorer, і всі вони правильно очистили текстові області.

Редагувати 2 : І я щойно перевірив, якщо ви використовуєте .val ('') у jQuery, він просто встановлює властивість .value для textarea's. Отже .значення має бути добре.

— Айстіна
джерело

3

.value = ''; працює в Chrome FF і Safari ... .innerHTML не працює в Chrome, не тестував в інших.

— Ян

1

Не слід використовувати innerHTML та innerText для текстових областей. Слід використовувати атрибут значення. . Таким чином, $ ( '# myTextArea') Вал ( '') або document.getElementById ( 'myTextArea'). Значення = '' кращий варіант

— Parth

8

Хоча вже було дано багато правильних відповідей, класичний підхід (читай, що не DOM) виглядає таким чином:

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

де в HTML ваша текстова область вкладена десь у такій формі:

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

І як це буває, це також працювало б з Netscape Navigator 4 та Internet Explorer 3. І, що не мало важливо, Internet Explorer на мобільних пристроях.

— Пол
джерело

2

Якщо його Jquery ..

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

або

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

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

— TigerTiger
джерело

2

додати текстові області до форми, називаючи їх, і просто використовувати об'єкти dom легко, як це:

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

— Шрді
джерело