• ベストアンサー

Nameは配列で、チェックされた箇所を特定したい。

こんにちは。 下記のように、nameを配列に設定してるCheckBoxについて、 func()内で、チェックされたCheckBoxを特定するには どうすればよいでしょうか？ チェック済みのCheckBoxではなく、 func()を起動させた、チェック、チェック解除箇所です。 チェックする度、解除する度、変るはずです。 <input type="checkbox" name="arr[]" onClick="func()"> <input type="checkbox" name="arr[]" onClick="func()"> <input type="checkbox" name="arr[]" onClick="func()"> <input type="checkbox" name="arr[]" onClick="func()">

noname#107872
noname#107872

質問者が選んだベストアンサー

  • ベストアンサー
  • venzou
  • ベストアンサー率71% (311/435)
回答No.4

>arr[]の何番目かというのは判らないのでしょうか？ <html> <head> <script language="JavaScript"><!-- function func(obj) { var a = document.getElementsByName("arr[]"); for(var i = 0; i < a.length; i++){ if(a[i] == obj){ alert(i); } } } // --></script> </head> <body> <form> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> </form> </body> </html> この方法が正しいのかちょっと自信はありませんが、Windowsの IE6 Opera9 FireFox2 で動作確認しました。

その他の回答 (4)

回答No.5

別解として（めんどくさい方法）idを指定してそこから取り出す。 （数字だけのIDは指定出来ません。アルファベットなどと組み合わせてください） <input type="checkbox" name="arr[]" id="arr1" value="check1" onlick="func(this);"> <input type="checkbox" name="arr[]" id="arr2" value="box1" onlick="func(this);"> func(element){ var num=element.id.substr(3,element.id.length); alert(num); } あらかじめJSONオブジェクトを作っておくと（valueから判断する場合） var chklist={'check1':1,'box1':2}; func(element){ var num=chklist[element.value]; alert(num); } 普通はANo.4のようにループさせて引数と同じオブジェクトかどうかを判断すると思います。 蛇足ながら<a>のname属性と混同される方も多いので、 <input>のname属性はHTML4.01、XHTML1.0、XHTML1.1ともsubmitとresetをのぞき必須（required）、submitとresetは任意 idに使用出来ない文字でもnameに使用出来る文字であれば、nameに指定することが出来ます > DTDより、INPUTに関する部分 > <!-- attribute name required for all but submit and reset --> 自分でも必須というのは今になって初めて知りました。。。

  • PED02744
  • ベストアンサー率40% (157/390)
回答No.3

1.name属性は推奨されません。id属性を使います。 　name属性はXHTML1.1で廃止されています。 　HTML4.0なら問題ないですが、id属性も併用するほうがよろしいでしょう。 2.id(name)属性で使える文字は、[a-zA-Z]、[0-9]、ハイフン(-)、アンダーライン(_)、コロン(:)、ピリオド(.) 　だけなので、"[]"を使ってはいけません。 　IDは普通の名前にして、onClickでfunc(this)などとして、JavaScript上でチェック対象をチェック 　すると思います。

  • venzou
  • ベストアンサー率71% (311/435)
回答No.2

関数を呼び出すときにthisを引数で渡します。 サンプル <html> <head> <script language="JavaScript"><!-- function func(obj) { alert(obj.checked); } // --></script> </head> <body> <form> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> <input type="checkbox" name="arr[]" onClick="func(this)"> </form> </body> </html>

noname#107872
質問者

お礼

回答ありがとうございます。 arr[]の何番目かというのは判らないのでしょうか？

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

<input type="checkbox" name="arr[]" onClick="func(this)"> とすればthisが自分自身（この場合はinputタグ）なので、特定できるでしょう。

noname#107872
質問者

お礼

回答ありがとうございます。 arr[]の何番目かというのは判らないのでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 特定のチェックボックスをチェックするには

    特定のチェックボックス「白」を CHECKEDにする方法を教えて下さい。 ＃数と位置が変動するので配列は取得できません。 ＃「もしもcolorの値が白なら CHECKED」のような関数にしたい。 <INPUT TYPE="CHECKBOX" NAME="color" VALUE="おまかせ"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="白"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="ピンク"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="緑">

  • checkbox 特定項目だけを、チェックするには

    こんにちは。いつもお世話になります。 checkbox内で、同じnameの中から特定のものだけ チェックさせるにはどうしたら良いでしょうか。 条件として、name='or52'の部分は変更出来ません。 <input type='button' value='A,B,Cだけを同時にチェック' onclick='checkAll();'> <form action='xxx.cgi' method='post' name='f1'> <input name='or5' type='checkbox' value='A'><br> <input name='or5' type='checkbox' value='B'><br> <input name='or5' type='checkbox' value='C'><br> <input name='or5' type='checkbox' value='D'><br> <input name='or5' type='checkbox' value='E'><br> <input name='or5' type='checkbox' value='F'><br> ......... </form> それで、こんなのをウェブから探してきました。 function checkAll() { for (i=0; i<7; i++) document.f1.elements["or52"+i].checked = true; } そして、同時にチェックしたいものだけ下記の様にしました。 <input name='or52' type='checkbox' value='A' id='or51'> <input name='or52' type='checkbox' value='B' id='or52'> <input name='or52' type='checkbox' value='C' id='or53'> 取りあえずできますが、エラーがでます。 「document.f1.elements["..."]は、objまたはnullではない！」 どうか教えて下さい。よろしくお願いします。

  • グループ別けされたチェックボックスの選択および解除

    こんばんは。いつもお世話になっております。 随分前になりますが、こちらでご指導いただいた内容を元に、タイトルにある、グループ別けされたチェックボックス郡の選択および解除をしたいと考えているのですが、お恥ずかしながら、思うような結果を得る事が出来ません。 お忙しい中恐縮ですが、ご指導いただきたく投函させて頂きます。 ※グループ単位で選択or解除をしたい □カテゴリ（すべて選択or解除） □１　□２　□３　□４　□５ □タイプ □１　□２　□３　□４　□５ 文字数制限に引っかかってしまったので、javascpipt部は非表示にいたします。 <input type="checkbox" onclick="CheckAlt(this)"> <div id="category"> <input type="checkbox" name="category[]" value="1"> <input type="checkbox" name="category[]" value="2"> <input type="checkbox" name="category[]" value="3"> <input type="checkbox" name="category[]" value="4"> <input type="checkbox" name="category[]" value="5"> </div> <input type="checkbox" onclick="CheckAlt(this)"> <div id="type"> <input type="checkbox" name="type[]" value="1"> <input type="checkbox" name="type[]" value="2"> <input type="checkbox" name="type[]" value="3"> <input type="checkbox" name="type[]" value="4"> <input type="checkbox" name="type[]" value="5"> </div>

  • チェック出来る数を制限&チェックされない場合0

    【チェックボックスにチェック出来る数を制限しながら、チェックされない場合には0を入力する】ということが希望です。 それぞれを分離させた場合は、下記で可能でした。 この2つを同時に満たす方法が分かりません。 ご教授頂きたくお願いいたします。 【チェックボックスにチェック出来る数を制限する方法】 <SCRIPT language="JavaScript"> <!-- // チェックボックスに使用している名前 chn = new Array("ch1","ch2","ch3","ch4","ch5"); chc = 3; // チェックできる数 // チェックボックスにチェックできる数を制限する function chBx(cn){ cnt = 0; for(i=0; i<chn.length; i++) { if(document.form1.elements[chn[i]].checked) cnt++; } if(cnt > chc) { alert("チェックできる項目は" + chc + "個までです"); document.form1.elements[cn].checked = false; } } //--> </SCRIPT> <input type="checkbox" name="ch1" value="2" onClick="chBx('ch1')"> <label for="type1">1</label> <BR> <input type="checkbox" name="ch2" value="2" onClick="chBx('ch2')"> <label for="type1">2</label> <BR> <input type="checkbox" name="ch3" value="3" onClick="chBx('ch3')"> <label for="type1">3</label> <BR> <input type="checkbox" name="ch4" value="4" onClick="chBx('ch4')"> <label for="type1">4</label> <BR> <input type="checkbox" name="ch5" value="5" onClick="chBx('ch5')"> <label for="type1">5</label> <BR> 【チェックボックスがチェックされない場合に0を入力する】 　　<input type="hidden" name="ch1" value="0"> 　　<input type="checkbox" onclick="this.form.ch1.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch2" value="0"> 　　<input type="checkbox" onclick="this.form.ch2.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch3" value="0"> 　　<input type="checkbox" onclick="this.form.ch3.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch4" value="0"> 　　<input type="checkbox" onclick="this.form.ch4.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch5" value="0"> 　　<input type="checkbox" onclick="this.form.ch5.value=this.checked ? 1 : 0"> 上記を同時に満たしたいというのが今回の質問の趣旨です。

  • javascriptでチェックボックスの選択状況をチェックする方法につ

    javascriptでチェックボックスの選択状況をチェックする方法について質問です。 チェックボックスを <input type="checkbox" name="chk[]" value="1"> <input type="checkbox" name="chk[]" value="2"> のようにした場合、チェックボックスが１か所以上選択されているかどうかは、 var count = 0; for (var i=0;i<document.myform.elements['chk[]'].length;i++){ if(document.myform.elements['chk[]'][i].checked){ count++; } } if(count==0){ window.alert("チェックしてください！"); } のようにすればチェック可能ですが、inputタグで <input type="checkbox" name="chk1[]" value="1"> <input type="checkbox" name="chk1[]" value="2"> <input type="checkbox" name="chk2[]" value="A"> <input type="checkbox" name="chk2[]" value="B"> のように「name」の配列名が変化する場合はどのようにすればチェック可能でしょうか？

  • チェックボックスの全選択/解除について

    お尋ねします。 チェックボックスの全選択/解除について １画面にチェックボックスのグループが複数（store、item）あります。 下記のソースだと【store】の全選択を押下すると【store】【item】両方とも 全選択状態になります。 【store】の全選択/全解除は【store】のみ 【item】の全選択/全解除は【item】のみにしたいのですが どのようにするとよろしいのでしょうか？ よろしくお願いします。 <SCRIPT TYPE="text/javascript"> <!-- function allcheck(targetForm,flag){ 　for(n=0;n<=targetForm.length-1;n++){ 　　if(targetForm.elements[n].type == "checkbox"){ 　　　targetForm.elements[n].checked = flag; 　　} 　} } --> </SCRIPT> <table width="70%" align = "center" cellspacing="0"> <form action="confirm.php" method="post" target="_blank"> <tr> <td align="center"> <input type="checkbox" name="store[]" value="1" />A店<br/> <input type="checkbox" name="store[]" value="2" />B店<br/> <input type="checkbox" name="store[]" value="3" />C店<br/> <input type="checkbox" name="store[]" value="4" />D店<br/> <input type="checkbox" name="store[]" value="5" />E店<br/> <input type="button" value="全選択" onClick="allcheck(this.form,true)"/><br> <input type="button" value="全解除" onClick="allcheck(this.form,false)"/> </td> <td align="center"> <input type="checkbox" name="item[]" value="1" />項目１<br/> <input type="checkbox" name="item[]" value="2" />項目２<br/> <input type="checkbox" name="item[]" value="3" />項目３<br/> <input type="checkbox" name="item[]" value="4" />項目４<br/> <input type="checkbox" name="item[]" value="5" />項目５<br/> <input type="button" value="全選択" onClick="allcheck(this.form,true)"/><br> <input type="button" value="全解除" onClick="allcheck(this.form,false)"/> </td> </tr> <tr align="center"> <td colspan="4"> <input type="submit" name="con" value="確認"> </td> </tr> </form> </table>

    • 締切済み
    • PHP
  • CHECKBOXとTEXTBOXのnameが同じ場合

    下記のようにチェックボックス名とテキストボックス名が同じ場合、エラーになりますが、これをjavascriptのみでうまく処理できる方法はないでしょうか。 ＃nameは同じまま。 ＃cgiを経由せず。 ＃下記と同じことをやりたいわけではありません。単に簡単にしたサンプルです。 <form name="main"> <INPUT TYPE="CHECKBOX" NAME="address" VALUE="東京">東京<BR> <INPUT TYPE="CHECKBOX" NAME="address" VALUE="大阪">大阪<BR> <INPUT TYPE="CHECKBOX" NAME="address" VALUE="その他" onclick="document.main.address.value = 'その他だよ'">その他<BR> <INPUT TYPE="text" NAME="address" SIZE="20"> </form>

  • チェックボックスから配列を使って値を受け取る方法

    チェックボックスから配列を使って値を受け取る方法について、 以下の通りに試してみたのですが、上手く行かず、 配列$fCに値が入りません。 どなたか原因を教えていただけないでしょうか。 ------------------------------------------------ hoge.html <form action="hoge.php"> <input type="checkbox" name="fC[]" value="hoge"> hoge <br> <input type="checkbox" name="fC[]" value="foo"> foo <br> <input type="checkbox" name="fC[]" value="bar"> bar <br> <input type="submit" value="OK"> </form> ---------------------------------------------------------- ------------------------------------------------- hoge.php <? for( $i=0; $i<count($fC); $i++ ) { print $i ." ::: " . $fC[$i] . "<br>\n"; } ?> ----------------------------------------------------------

    • ベストアンサー
    • PHP
  • 複数のチェックボックス項目があり、そのチェック状態によって

    複数のチェックボックス項目があり、そのチェック状態によって 処理を分岐したいのですが、スマートなjavascriptの書き方が あれば教えてください！ 【例】 <input type="checkbox" name="koumokuA" value="A1" /> <input type="checkbox" name="koumokuA" value="A2" /> <input type="checkbox" name="koumokuA" value="A3" /> <input type="checkbox" name="koumokuA" value="A4" /> <input type="checkbox" name="koumokuA" value="A5" /> <input type="checkbox" name="koumokuB" value="B1" /> <input type="checkbox" name="koumokuB" value="B2" /> <input type="checkbox" name="koumokuB" value="B3" /> <input type="checkbox" name="koumokuB" value="B4" /> <input type="checkbox" name="koumokuC" value="C1" /> <input type="checkbox" name="koumokuC" value="C2" /> <input type="checkbox" name="koumokuC" value="C3" /> <input type="checkbox" name="koumokuC" value="C4" /> もし【koumokuA】のA2とA3、【koumokuB】のB1とB4が選択された場合 同項目ではor条件、他項目ではand条件で処理したいので 考え方としては、 if(koumokuA=="A2" || koumokuA=="A3"){ if(koumokuB=="B1" || koumokuB=="B4"){ 実行内容 } } こんな感じなのですが、 実際にはチェックボックスの値は配列になるのでこのスクリプトでは動かない点と 効率よく複数のチェックボックスの選択結果を判定して、スクリプトを実行する 組み方があればご教授ください。 実行結果は、データが格納された配列の中から、選択項目に対応したデータを 表示するようにしたいのです。 よろしくお願いします。

  • JavaScript チェックボックスで指定の箇所をチェックする方法

    初めての投稿ですが、よろしくお願いします。m(_ _)m 現在下記ソースの様なチェックボックスで出来たテーブルフォームを作成しております。 一覧表の行or列の先頭にあるチェックボックスを選択すると 選択された行or列にあるチェックボックスを全てチェックされ、 先頭のチェックボックスを外すと全て解除される。 (例：横A□チェックボックスを選択すると右にある全てのチェックボックスが選択される。チェックを外すと右にある全てのチェックボックスが未選択になる。) という事を行いたいと思い、色々調べてみたのですが、 発見できませんでしたので質問させていただきました。 どうかお助けください。m(>_<)m -- <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE></TITLE> </HEAD> <BODY> <form name="F1"> <table border="1"> <tr> <td>一覧</td> <td>縦A<br><input type="checkbox" id="" /></td> <td>縦B<br><input type="checkbox" id="" /></td> <td>縦C<br><input type="checkbox" id="" /></td> </tr> <tr> <td>横A<input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> </tr> <tr> <td>横B<input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> </tr> <tr> <td>横C<input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> <td><input type="checkbox" id="" /></td> </tr> </table> </form> </BODY> </HTML>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する