-4

3 つのチェックボックス (1、2、3) があるとします。チェックボックス 1 をクリックすると、チェックボックス 2 と 3 がオフになります。

別の例: チェックボックス 2 をクリックすると、チェックボックス 1 と 3 がオフになります。

チェックボックス 3 をクリックすると、チェックボックス 1 と 2 のチェックが外れます。

HTML

<input type="checkbox" class="check" value="one"><label>One</label>
<input type="checkbox" class="check" value="two"><label>Two</label>
<input type="checkbox" class="check" value="three"><label>Three</label>

jQuery

$(document).ready(function(){
    $(".check").click(function(){
        $(".check").attr("checked", "checked");
    } else {
        $(".check").removeAttr("checked");
    });
});
4

4 に答える 4

2

ラジオボタンは、あなたがやろうとしていることにより適しています。ただし、チェックボックスを使用する必要がある場合は、次のようにする必要があります。

$(".check").click(function(){
    $(".check").not(this).prop("checked", false);
});
于 2013-08-27T14:33:28.670 に答える
0

1 つのみをチェックするオプションのグループについては、ラジオ ボタンまたは単一選択ボックスを使用します。

<input type="radio" name="check" value="one"><label>One</label>
<input type="radio" name="check" value="two"><label>Two</label>
<input type="radio" name="check" value="three"><label>Three</label>

チェックボックスの状況に固執する必要がある場合は、次のようにすることができます。

$(".check").change(function(){
    $(".check").prop("checked", false);
    $(this).prop("checked", true)
});

ユーザーがラベルなどをクリックする可能性があるため、代わりにイベントにバインドしていることに注意してchangeください (この場合、チェックボックスで合成クリックがトリガーされるかどうかはわかりません)。

補足: あなたのlabel要素にはfor属性がありません。

于 2013-08-27T14:34:27.290 に答える
0 
$(document).ready(function() {
    var $cbs = $(".check").click(function() {
        $cbs.not(this).prop("checked", false);
    });
});
于 2013-08-27T14:34:56.203 に答える
0

回答パート 1: これはまさにラジオ ボタンが設計された目的であり、デフォルトでこの動作をします。

回答パート 2: クリック関数は次のようになります。

$(".check").click(function(){

    $(".check").attr("checked", false);
    $(this).attr("checked",true);

});
于 2013-08-27T14:32:19.227 に答える