• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:java script フォームのチェックボックス入力制限について)

JavaScriptフォームのチェックボックス入力制限について

このQ&Aのポイント
  • JavaScriptフォームのチェックボックス入力制限について解説します。
  • この記事では、JavaScriptを使用してチェックボックスの入力を制限する方法を紹介します。
  • 具体的なコード例を使用して、チェックボックスが選択された場合にラジオボタンを有効にする方法を説明します。

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

  • ベストアンサー
  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

下のようにグループごとにまとめて同じ<label>内に格納してしまって、 <form name="form3" action="#">  <label for="chk1">   <input type="checkbox" id="chk1" name="chk1" onclick="fchk(this)" checked="checked"> このボタンのチェックを外すとラジオボタンが無効化<br>    <label for="chk1_r1"><input type="radio" id="chk1_r1" name="r1">選択肢</label>    <label for="chk1_r2"><input type="radio" id="chk1_r2" name="r1">選択肢</label>    <label for="chk1_r3"><input type="radio" id="chk1_r3" name="r1">選択肢</label>  </label>  <br>  <label for="chk2">  <input type="checkbox" id="chk2" name="chk2" onclick="fchk(this)" checked="checked"> このボタンのチェックを外すとラジオボタンが無効化<br>   <label for="chk2_r1"><input type="radio" id="chk2_r1" name="r1">選択肢</label>   <label for="chk2_r2"><input type="radio" id="chk2_r2" name="r1">選択肢</label>   <label for="chk2_r3"><input type="radio" id="chk2_r3" name="r1">選択肢</label>  </label>  <br>  <label for="chk3">  <input type="checkbox" id="chk3" name="chk3" onclick="fchk(this)" checked="checked"> このボタンのチェックを外すとラジオボタンが無効化<br>   <label for="chk3_r1"><input type="radio" id="chk3_r1" name="r1">選択肢</label>   <label for="chk3_r2"><input type="radio" id="chk3_r2" name="r1">選択肢</label>   <label for="chk3_r3"><input type="radio" id="chk3_r3" name="r1">選択肢</label>  </label> </form> SCRIPTは下のようにしてはどうでしょう(全角空白は半角空白にして!) <script type="text/javascript"> function fchk(obj){  var input=obj.parentNode.getElementsByTagName("input");  var len=input.length;  if(obj.checked==true){   for(var i=0; i<len; i++){    if(input[i].type=="radio"){    input[i].disabled=false;    }   }  }else{   for(var i=0; i<len; i++){    if(input[i].type=="radio"){    input[i].checked=false;    input[i].disabled=true;    }   }  } } </script>

その他の回答 (1)

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

たとえばチェックボックスの名前を一緒にして、こんな風にやるとどうでしょう? <script> function checkfunc(obj){ var check_flg=true; var f=obj.form; for (var i=0;i<f.length;i++){ if(f[i].name==obj.name && f[i].checked){ check_flg=false; break; } } for (var i=0;i<f.length;i++){ if(f[i].type=="radio"){ f[i].disabled=check_flg; } } } </script> <form> <input type="checkbox" name="ch[]" onclick="checkfunc(this)" />ch1 <input type="checkbox" name="ch[]" onclick="checkfunc(this)" />ch2 <input type="checkbox" name="ch[]" onclick="checkfunc(this)" />ch3 <input type="radio" name="r1" disabled />ra1 <input type="radio" name="r1" disabled />ra2 <input type="radio" name="r1" disabled />ra3 </form>

atwork
質問者

お礼

動きました! ありがとうございました ^^