JavaScriptで<textarea>のコンテンツを変更する方法

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リファレンスがあります

value DOMStringコントロールに含まれる生の値。

— グレッグ
ソース

価値がないからといって価値があるとは思わなかった。値=その中に感謝します！

— イアン・

1

WindowsモバイルデバイスのInternet Explorerでは機能しません。

— ポール

9

はクロムv61では機能しません。値は入力ボックスの値には影響しません

— Aero Wang

15

場合あなたはjQueryのを使用することができますし、私は非常にあなたがお勧めします、あなたは単にだろう

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

それ以外の場合は、ブラウザに依存します。あなたが持っていると仮定

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

ほとんどのブラウザで

myTextArea.innerHTML = '';

しかし、Firefoxでは、

myTextArea.innerText = '';

ユーザーが使用しているブラウザーを把握することは、読者の課題として残されています。もちろん、jQueryを使用しない限り、;）

編集：取り戻します。textareaでの.innerHTMLのサポートが改善されたようです。私はChrome、Firefox、Internet Explorerでテストしましたが、すべてテキスト領域が正しくクリアされました。

編集2：そして、jQueryで.val（ ''）を使用すると、textareaの.valueプロパティが設定されるだけです。したがって、.valueは問題ないはずです。

— アイスティーナ
ソース

3

.value = ''; Chrome FFおよびSafariで動作します... .innerHTMLはChromeで動作しませんでした。他ではテストしていません。

— イアン・

1

textareasにはinnerHTMLとinnerTextを使用しないでください。value属性を使用する必要があります。したがって、$（ '＃myTextArea'）。val（ ''）またはdocument.getElementById（ 'myTextArea'）。value = ''が最適なオプションです

— パート

8

多くの正解がすでに与えられていますが、古典的な（非DOMを読み取る）アプローチは次のようになります。

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

HTMLのtextareaは、次のような形式でどこかにネストされています。

<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

— タイガータイガー
ソース

2

次のように、textareaをフォームに配置して名前を付け、domオブジェクトを簡単に使用します。

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

— シュルディ
ソース