- ベストアンサー
ラジオボタンを選択後、別のチェックボックスを使用できなくする方法
ラジオボタンＲ１・Ｒ２・Ｒ３ と チェックボックス Ｃ１・Ｃ２・Ｃ３・Ｃ４がフォームに配置されています。 １： 初期状態でＲ１が選択されており、さらにチェックボックスの全てが使用できない状態になっている。 ２： Ｒ２若しくはＲ３を選択すると、チェックボックスの全てが使用できる状態になる。 ３： 改めてＲ１を選択すると初期状態に戻る。 以上のような動作をさせたいと思いますが、よくわかりません。 お手数ですが、ご指導ください。
- xiaolong_goo
- お礼率64% (252/388)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
サンプルです。 参考にしてください。 <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function r_check(){ if(document.F1.R.length){ for (var i=0; i<document.F1.R.length; i++){ if (document.F1.R[i].checked){ if(i==0){ document.F1.C1.disabled = true; document.F1.C2.disabled = true; document.F1.C3.disabled = true; document.F1.C4.disabled = true; }else if(i==1 || i==2){ document.F1.C1.disabled = false; document.F1.C2.disabled = false; document.F1.C3.disabled = false; document.F1.C4.disabled = false; } } } } } </SCRIPT> </HEAD> <BODY bgcolor="#CCFFCC" onLoad="r_check()"> <FORM name="F1"> <INPUT type="radio" name="R" value="R1" onClick="r_check()" checked>R1 <INPUT type="radio" name="R" value="R2" onClick="r_check()">R2 <INPUT type="radio" name="R" value="R3" onClick="r_check()">R3 <INPUT type="checkbox" name="C1" value="C1">C1 <INPUT type="checkbox" name="C2" value="C2">C2 <INPUT type="checkbox" name="C3" value="C3">C3 <INPUT type="checkbox" name="C4" value="C4">C4 </FORM> </BODY> </HTML>
その他の回答 (1)
- me_no_car
- ベストアンサー率24% (22/90)
色々やり方あると思いますが、 この場合は、DHTMLを使うのが一番簡単だと思います。 こんな感じで同でしょう <HTML> <HEAD> <SCRIPT> function chk(iNum) { var loopCnt; var onChk = new Array( true , false ); for( loopCnt=1 ; loopCnt<=4 ; loopCnt++ ){ eval("ch" + loopCnt + ".disabled = onChk[iNum]"); } } </SCRIPT> </HEAD> <BODY> <input type="radio" name="aa" value="1" onClick="chk(0)" checked>R1 <input type="radio" name="aa" value="2" onClick="chk(1)">R2 <input type="radio" name="aa" value="3" onClick="chk(1)">R3 <BR> <BR> <input id="ch1" type="checkbox" name="b1" value="4" disabled>C1 <input id="ch2" type="checkbox" name="b2" value="5" disabled>C2 <input id="ch3" type="checkbox" name="b3" value="6" disabled>C3 <input id="ch4" type="checkbox" name="b4" value="7" disabled>C4 </BODY> </HTML>
お礼
DHTMLという手法もあるのですね。 今はJAVA SCRIPTだけで精一杯ですので、落ち着いたら勉強してみます。 有り難うございました。
お礼
有り難うございました。 自分では、チェックボックスだと思って質問したのですが、実はテキストボックスでした・・・ しかしながら、教えていただいたコードを変更することで対応できました。