Form
オブジェクトには名前NAME
属性を記述する。また、Form
内のinput
オブジェクトには名前(name
)属性またはID(id
)属性を付与する。
<body> <form name="vs_sampleform" action="#"> テキスト0:<input type="text" size="30" /><br /> テキスト1:<input type="text" name="vs_text1" size="30" /><br /> テキスト2:<input type="text" id="vs_text2" size="30" /><br /> テキスト3:<input type="text" name="vs_text3" size="30" /><br /> テキスト4:<input type="text" name="vs_text4" size="30" /><br /> テキスト5:<input type="text" name="vs_text5" size="30" /><br /> テキスト6:<input type="text" id="vs_text6" size="30" /><br /> テキスト7:<input type="text" id="vs_text7" size="30" /><br /> <input type="button" value="書き込み:writeData(this.form)" onclick="writeData(this.form)" onkeypress="writeData(this.form); return false;" /> </form> </body>
それぞれのテキストフィールドへの参照方法のいくつかを紹介する。上位より、Form
オブジェクトを引数で受け取るものとする。
※引数での渡し方は、this.form
で渡せる。
<script type="text/javascript"> function writeData(obj) { document.forms[0].elements[0].value = "elements配列による参照"; document.forms["vs_sampleform"].vs_text1.value = "name属性による参照"; document.forms["vs_sampleform"].vs_text2.value = "id属性による参照"; document.forms["vs_sampleform"].elements["vs_text3"].value = "elementsの連想配列による参照"; document.forms["vs_sampleform"].elements[4].value = "組み合わせ"; obj.elements[5].value = "thisによる参照(elements配列)"; obj.vs_text6.value = "thisによる参照(name属性)"; document.getElementById("vs_text7").value = "DOMによる参照"; } </script>