- ベストアンサー
チェックボックスのON/OFFに応じて別の複数のチェックボックスも連動ON/OFF
7番のcheckboxをON→1,2,4,5番にチェックもON 7番のcheckboxをOFF→1,2,4,5番にチェックもOFF という風に動作させる記述をご教示ください。 よろしくお願い致します。 <html> <head> <script type="text/javascript"> </script> </head> <body> <form action="" method="post" name="myform"> 去年<br> 1番<input type="checkbox" name="kyonen[]" value="1">1月<br> 2番<input type="checkbox" name="kyonen[]" value="2">2月<br> 3番<input type="checkbox" name="kyonen[]" value="3">3月<br> 今年<br> 4番<input type="checkbox" name="kotosi[]" value="1">1月<br> 5番<input type="checkbox" name="kotosi[]" value="2">2月<br> 6番<input type="checkbox" name="kotosi[]" value="3">3月<br> 7番<input type="checkbox" name="mychk">去年と今年の1、2月をまとめてチェック<br> </form> </body> </html>
- litton101
- お礼率89% (1106/1240)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
条件が複雑になるともう少し工夫が必要になりますが、 とりあえずはこんな感じでいけると思います。 <html> <head> <script type="text/javascript"> function checkFunc(obj){ f=obj.form for(var i=0;i<f.length;i++){ if((f[i].name=="kyonen[]" || f[i].name=="kotosi[]")&& (f[i].value=="1" ||f[i].value=="2")) f[i].checked=obj.checked } } </script> </head> <body> <form action="" method="post" name="myform"> 去年<br> 1番<input type="checkbox" name="kyonen[]" value="1">1月<br> 2番<input type="checkbox" name="kyonen[]" value="2">2月<br> 3番<input type="checkbox" name="kyonen[]" value="3">3月<br> 今年<br> 4番<input type="checkbox" name="kotosi[]" value="1">1月<br> 5番<input type="checkbox" name="kotosi[]" value="2">2月<br> 6番<input type="checkbox" name="kotosi[]" value="3">3月<br> 7番<input type="checkbox" name="mychk" onClick="checkFunc(this)">去年と今年の1、2月をまとめてチェック<br> </form> </body> </html>
その他の回答 (1)
- karumakaruma
- ベストアンサー率65% (65/100)
名前を配列にしておくと、CGI、phpなどでは使いやすいですが JavaScriptでは、使いにくいんですよね（＾＾；； <html> <head> <script type="text/javascript"> <!-- function CheckMyChk(){ with( document.myform ){ for( i=0; i<elements['kyonen[]'].length;i++ ){ elements['kyonen[]'][i].checked = mychk.checked; } for( i=0; i<elements['kotosi[]'].length;i++ ){ elements['kotosi[]'][i].checked = mychk.checked; } } } //--> </script> </head> <body> <form action="" method="post" name="myform"> 去年<br> 1番<input type="checkbox" name="kyonen[]" value="1">1月<br> 2番<input type="checkbox" name="kyonen[]" value="2">2月<br> 3番<input type="checkbox" name="kyonen[]" value="3">3月<br> 今年<br> 4番<input type="checkbox" name="kotosi[]" value="1">1月<br> 5番<input type="checkbox" name="kotosi[]" value="2">2月<br> 6番<input type="checkbox" name="kotosi[]" value="3">3月<br> 7番<input type="checkbox" name="mychk" onChange="CheckMyChk();" onKeyPress="CheckMyChk();">去年と今年の1、2月をまとめてチェック<br> </form> </body> </html>
お礼
karumakarumaさん、ご回答ありがとうございました、 お礼遅くなって失礼しました。 ＃１さんのものと違って、for文による解法なのですね。 都合のよさそうな方を適用させて いただこうと思いましたが、karumakarumaさんの方、 わたしの環境（IE6)でうまく動かないようです？？ ７番をチェックした後、６番をチェックすると全部にチェックが 入る、みたいな動作をするのですが・・・？ どこか、些細なバグなどありますでしょうか？？ せっかくお教えいただいたものなので、もしよろしければ 再度ご教示いただけたらうれしいです。
お礼
yamabejpさん、いつもお世話になります 礼によって御礼遅くなってすみません。 動作はもちろんばっちりでした。 if条件内で、||で条件を区切ればチェックしたい 対象も簡単に設定でき、大変助かりました。 ありがとうございました。