フォームのエレメントを参照する
フォームを参照する方法としてdocument.formsを使用する方法があります。
フォームが複数設置してあるページで、0から始まる通し番号を指定してフォームを参照します。
以下のように三つのフォームがあるとします。


以下のボタンを押すと、それぞれのname属性を表示します。



以下、ソースです。0からの通し番号で参照しているのがわかります。

<form name="namae1">
<input type="text" id="field1" />
<input type="submit" />
</form>
<form name="namae2">
<input type="text" id="field2" />
<input type="submit" />
</form>
<form name="namae3">
<input type="text" id="field3" />
<input type="submit" />
</form>
<input type="button" value="ボタン" onclick="a();" /><br /><br />
<script language="Javascript">
<!--
function a(){
    alert(document.forms[0].name);
    alert(document.forms[1].name);
    alert(document.forms[2].name);
}
// -->
</script>
ではフォームのエレメント(要素)を参照する方法ですが、document.フォームのname値.elementsを使用します。
このオブジェクトは配列を返します。フォームのエレメントを参照するには0からの通し番号で参照します。上記のname="namae"のフォームを使用しています。



以下、ソースです。

<input type="button" value="ボタン" onclick="b();" /><br /><br />
<script language="Javascript">
<!--
function b(){
    alert(document.namae1.elements.length);
    alert(document.namae1.elements[0].id);
    alert(document.namae1.elements[0].type);
    alert(document.namae1.elements[1].id);
    alert(document.namae1.elements[1].type);
}
// -->
</script>
ちなみに、document.namae1.elements.lengthで該当フォームの要素数を表示しますのでループする場合は便利です。

フォームの個数を求める
ページ内のフォームの数を求めるにはdocument.forms.lengthを使用します。
ボタンを押すとページ内のフォーム数を表示します。



以下、ソースです。

<input type="button" value="ボタン" onclick="c();" /><br /><br />
。<br /><br />
<script language="Javascript">
<!--
function c(){
    alert(document.forms.length);
}
// -->
</script>

Back to top

Information