web-dev-qa-db-ja.com

JavaScriptを使用したHTMLフォーム入力タグ名要素配列

これは2つの部分からなる質問です。先日、誰かが同様の質問に回答しました（PHPにはこのタイプの配列に関する情報も含まれていました）が、見つかりません。

1.）まず、フォームの入力タグの名前要素の末尾に作成される配列の正しい用語は何ですか？

<form>

    <input name="p_id[]" value="0"/>
    <input name="p_id[]" value="1"/>
    <input name="p_id[]" value="2"/>

</form>

2.）JavaScriptを使用してその配列から情報を取得するにはどうすればよいですか？具体的には、配列の要素を数えたいだけです。ここに私がやったことがありますが、うまくいきません。

function form_check(){
    for(var i = 0; i < count(document.form.p_id[]); i++){  //Error on this line

        if (document.form.p_name[i].value == ''){
            window.alert('Name Message');
            document.form.p_name[i].focus();
            break;
        }

        else{
            if (document.form.p_price[i].value == ''){
                window.alert('Price Message');
                document.form.p_price[i].focus();
                break;
            }

            else{
                update_confirmation();
            }
        }
    }
}
javascripthtmlformsinput
21
ubiquibacon

1.）まず、フォームの入力タグの名前要素の末尾に作成される配列の正しい用語は何ですか？

「時々混乱するPHPism」

JavaScriptに関する限り、同じ名前のフォームコントロールの束は、同じ名前のフォームコントロールの束であり、角括弧を含む名前のフォームコントロールは、角括弧を含む名前のフォームコントロールです。

PHP同じ名前のフォームコントロールの命名規則が便利な場合があります（コントロールのグループが多数あるため、次のようなことができる場合：

<input name="name[1]">
<input name="email[1]">
<input name="sex[1]" type="radio" value="m">
<input name="sex[1]" type="radio" value="f">

<input name="name[2]">
<input name="email[2]">
<input name="sex[2]" type="radio" value="m">
<input name="sex[2]" type="radio" value="f">

）しかし、一部の人々を混乱させます。他の一部の言語では、この規則が最初に記述されて以来、この規則が採用されていますが、一般的にはオプション機能としてのみ使用されています。たとえば、 JavaScript用のこのモジュール を使用します。

2.）JavaScriptを使用してその配列から情報を取得するにはどうすればよいですか？

elementsからフォームコントロールと同じ名前のプロパティを取得するだけです。秘Theは、フォームコントロールの名前に角かっこが含まれているため、 ドット表記で角かっこ表記を使用する必要がある を他のように使用できないことです 特別な文字 。

その名前の要素が複数あるため、単一のコントロールではなくコレクションになります。そのため、長さプロパティを利用する標準のforループでループできます。

var myForm = document.forms.id_of_form;
var myControls = myForm.elements['p_id[]'];
for (var i = 0; i < myControls.length; i++) {
    var aControl = myControls[i];
}
42
Quentin

これを次のように試してください：

var p_ids = document.forms[0].elements["p_id[]"];
alert(p_ids.length);
for (var i = 0, len = p_ids.length; i < len; i++) {
  alert(p_ids[i].value);
}
9
Matt King

document.form.p_id.length ... count（）ではありません。

あなたは本当にフォームにIDを与えるべきです

<form id="myform">

次に、以下を使用して参照します。

var theForm = document.getElementById("myform");

次に、次のような要素を参照します。

for(var i = 0; i < theForm.p_id.length; i++){
4
Andir

質問に順番に回答するには：
1）これに特定の名前はありません。同じ名前の複数の要素です（この場合も同様です）。名前は一意ではありません。そのため、idが考案されました（一意であると想定されています）。
2）

 function getElementsByTagAndName（tag、name）{
 //これを高速化する開始要素を渡すことができます
 var elem = document.getElementsByTagName（tag）; 
 var arr = new Array（）; 
 var i = 0; 
 var iarr = 0; 
 var att; 
 for（; i <elem.length; i ++）{
 att = elem [i] .getAttribute（ "name"）; 
 if（att == name）{
 arr [iarr] = elem [i]; 
 iarr ++; 
} 
} 
 return arr; 
}
2
jmoreno