【javascript】テキストエリアの文字列を別のテキストエリアに表示する

この記事について

環境javascript
目的テキストエリアの文字列を別のテキストエリアに表示する
結果document.forms経由でvalueを代入する。id指定・番号指定・form name指定の書き方がある

javascript で、テキストエリアの文字列を別のテキストエリアに表示したときの覚書

以下のようにテキストエリアが二つある。

<div>
	<form id="form1">
	<textarea name="msg" cols=40 rows=4 id="textarea1">
	この文字を textarea2 に表示したい
	</textarea>
</form>
</div>

<div>
	<form id="form2">
	<textarea name="msg" cols=40 rows=4 id="textarea2">
	ここに textarea1 の文字列が表示される
	</textarea>
</form>

textarea1 の文字列を textarea2 に表示する、javascript の記述

idを指定してアクセスする記述

document.forms["form2"].textarea2.value = document.forms["form1"].textarea1.value;

こういう記述もある

document.forms.form2.textarea2.value = document.forms.form1.textarea1.value;

formは番号指定でも可能

document.forms[1].textarea2.value = document.forms[0].textarea1.value;

form の name で指定する方法

<div>
	<form id="form1" name="form_name1">
	<textarea name="msg" cols=40 rows=4 id="textarea1">
	この文字を textarea2 に表示したい
	</textarea>
</form>
</div>

<div>
	<form id="form2" name="form_name2">
	<textarea name="msg" cols=40 rows=4 id="textarea2">
	ここに textarea1 の文字列が表示される
	</textarea>
</form>

form の name で指定する場合、forms の記述は不要

document.form_name2.textarea2.value = document.form_name1.textarea1.value;

参考サイト

タイトルとURLをコピーしました