• ベストアンサー

一つのチェックボックスのON/OFFに応じて他の複数をON/OFFに

昨日の質問した下記の関連で再質問です。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=1765687 親1に対し、子1~4と、合計5つのチェックボックスがあり、 親のチェックOFF ⇒ 子1~4をdisableに、 子のチェックON ⇒ 子1~4をactive としたいのですが、 #4さんのご回答を適用すると、上記5つのチェックボックス以外も 全てdisableの対象になってしまいます。 他方、自分の元質問のソースを改造しようとも思いましたが、 子1~4のname属性が全て違う名前のため、そのままでは使えません。 ついでに(些細なことですが) 子1~4の全てがONにされた時に、親がOFFなら自動でONにしたいです。 テンプレートは下記ですが、よろしくお願い致します。 <html> <head> <script language="javascript" type="text/javascript"> // ■■■■ </script> </head> <body> <form id="query" name="query"> <input type="checkbox" name="oya" value="1" checked>親 <input type="checkbox" name="ko1" id="ko1" value="1" checked>子1 <input type="checkbox" name="ko2" id="ko2" value="1" checked>子2 <input type="checkbox" name="ko3" id="ko3" value="1" checked>子3 <input type="checkbox" name="ko4" id="ko4" value="1" checked>子4 </form> </body> </html>

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

  • ベストアンサー
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

ソースによっては nameがko+nで1から連番になっているとかだったら単純にループで回せるかも。 ------------------------------------------------------ <html> <head> <script language="javascript" type="text/javascript"> function autochk(p,name){ var f = p.form; var el; for(var prop in f){ if(prop.toString().substr(0,2)==name){//名前がname('ko')で始まるもの el=f.elements[prop]; if(el.type=="checkbox"){//このチェックは省略してもいいかも el.disabled = !p.checked; } } } } </script> </head> <body> <form id="query" name="query"> <input type="checkbox" name="oya" value="1" checked checked onclick="autochk(this,'ko');">親 <input type="checkbox" name="ko1" id="ko1" value="1" checked>子1 <input type="checkbox" name="ko2" id="ko2" value="1" checked>子2 <input type="checkbox" name="ko3" id="ko3" value="1" checked>子3 <input type="checkbox" name="ko4" id="ko4" value="1" checked>子4 <input type="text" name="other" value="その他"> </form> </body> </html>

litton101
質問者

お礼

BLUEPIXYさん、再々のレスありがとうございます。 動作確認させていただきましたが 実にいい感じです。 name('ko')で始める件については問題ありませんので そのように調整いたします。

すると、全ての回答が全文表示されます。

その他の回答 (2)

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

idよりはこの場合はclassの方が使いやすくない ですか? <html> <head> <script language="javascript" type="text/javascript"> function autochk(f){ for(var i=0;i<f.form.length;i++){ if (f.form.elements[i].className=="ko"){f.form.elements[i].disabled = !f.checked;} } } </script> </head> <body> <form> <input type="checkbox" name="oya" value="1" checked onclick="autochk(this);">親 <input type="checkbox" name="ko1" class="ko" value="1" checked>子1 <input type="checkbox" name="ko2" class="ko" value="1" checked>子2 <input type="checkbox" name="ko3" class="ko" value="1" checked>子3 <input type="checkbox" name="ko4" class="ko" value="1" checked>子4 <input type="checkbox" name="other" value="1" checked>他 </form> </body> </html>

litton101
質問者

お礼

yambejpさん、いつもありがとうございます。 動作はすこぶる快適です。 おかげさまで大変助かりました。 ありがとうございました。

すると、全ての回答が全文表示されます。
  • bin-chan
  • ベストアンサー率33% (1403/4213)
回答No.1

> 親のチェックOFF ⇒ 子1~4をdisableに、 > 子1~4の全てがONにされた時に、親がOFFなら自動でONにしたいです。 親がチェックOFFで子1~4がdisableなら 子のチェック自体が行えないことないですか?

litton101
質問者

お礼

本当ですね、失礼しました。 何のためのdisableなことやら(^^;;; > 子1~4の全てがONにされた時に、親がOFFなら自動でONにしたいです。 は、どうか無視下さい。

すると、全ての回答が全文表示されます。

関連するQ&A

専門家に質問してみよう