0

チェックボックスの2つのグループがあります。最初のチェックボックスのグループをクリックすると、2番目のチェックボックスのグループのチェックを外す必要があります。しかし、最初のチェックボックスを2回クリックすると、2番目のチェックボックスがオフになります。これが私のJavaScriptコードです

 <script>
            function uncheck0(){
                for(var ii=1; ii<=3; ii++){
                    if(document.getElementById("q6_"+ii).checked==true){
                       document.getElementById("q6_"+ii).checked=false;
                    }
                }
            }
            function uncheck(id, from, to){
                for(var ii=from; ii<=to; ii++){
                    if(document.getElementById(id+ii).checked==true){
                       document.getElementById(id+ii).checked=false;
                    }
                }
            }
        </script>

これが私のHTMLコードです。最初のグループにはラジオボタンがあり、2番目のグループにはチェックボックスがあります。

<p>IF YES: When will the review begin?</p>
            <label  for="q6"><input type="radio" class="styled" value="Within the next 12 months" name="q6[]" id="q6_1">Within the next 12 months</label>
            <label  for="q6"><input type="radio" class="styled" value="Within the next 24 months" name="q6[]" id="q6_2">Within the next 24 months</label>
            <label  for="q6"><input type="radio" class="styled" value="We are currently doing it" name="q6[]" id="q6_3">We are currently doing it</label><br>
        <br>
        <p>IF NO: Why Not</p>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Lack of budget" name="q6[]" id="q6_4">Lack of budget</label>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Lack of resource" name="q6[]" id="q6_5">Lack of resource</label>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Do not see the need" name="q6[]" id="q6_6">Do not see the need</label>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Lack of know how/expertise" name="q6[]" id="q6_7">Lack of know how/expertise</label>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Complexity" name="q6[]" id="q6_8">Complexity</label>
            <label onclick="uncheck('q6_',1,3);" for="q6"><input type="checkbox" class="styled" value="Contractual obligations" name="q6[]" id="q6_9">Contractual obligations</label>
            <label onclick="uncheck('q6_',1,3);" for="q5"><input type="checkbox" class="styled" value="Other" name="q6[]" id="q6_10">Other </label>
            <label onclick="uncheck('q6_',1,3);" for="q5a">Please state</label><input type="text" value="" id="q6a" name="q6a">

チェックボックスとラジオのスタイリングにJavaScriptファイル「custom-form-element.js」を使用しました

4

2 に答える 2

2

デフォルトの「チェック済み」値が必要です

 <input type="checkbox" checked="true">

そうしないと、コードはチェックされていないと判断し、値を「チェック済み」に設定し、2 回目のクリックで「チェックを外します」。

于 2012-06-08T07:02:36.687 に答える
2

onclick="uncheck('q6_',1,3);"をラベルから入力ボックスに移動します。
最終的なコードは次のようになります。

<label for="q6">
    <input type="checkbox" onclick="uncheck('q6',1,3);" class="styled" value="Lack of budget" name="q6[]" id="q6_1">Lack of budget</label>
<label onclick="uncheck('q6_',1,3);" for="q6_2"><input type="checkbox" class="styled" value="Lack of resource" name="q6[]" id="q6">Lack of resource</label>
于 2012-06-08T07:02:45.237 に答える