1

これを行う方法がわかりません。

3 つのチェックボックスがあり、そのうちの 1 つをクリックすると、他のチェックボックスが無効になります。jQueryを使用してこれを達成するにはどうすればよいですか

<input type="checkbox" name="box1" >
<input type="checkbox" name="box2" >
<input type="checkbox" name="box3" >

これで私を助けてください。

4

6 に答える 6

1

クラス名を使用して DOM 要素を参照することを常にお勧めします。これにより、コードがよりクリーンで目立たなくなります。このコードは、はるかに包括的で保守が容易です。

<input type="checkbox" name="box1" class="check checker">
<input type="checkbox" name="box2" class="check">
<input type="checkbox" name="box3" class="check">

JS:

$('.checker').change(function() {
    $('.check').not(this).prop('disabled', this.checked);
});

この場合、 JSコードを変更することなく、チェックボックスの場所(siblingsアプローチが壊れる)、名前(失敗する)を変更できます。[name^="box"]

http://jsfiddle.net/4krnh/

于 2013-02-01T09:32:01.163 に答える
1

jsFiddle 1

$('input[type="checkbox"]').click(function() {
    $(this).siblings().attr('disabled', true); 
});

jsFiddle 2

または、選択解除時にチェックボックスを有効にしたい場合は、これを使用できます。

$('input[type="checkbox"]').click(function() {
    $(this).siblings().attr('disabled', this.checked);
});
于 2013-02-01T09:29:20.833 に答える
0

これを試して

   $('input:checkbox').click(function() {
         $(this).siblings('input:checkbox').not(this).attr("disabled","disabled");
     });

JSFIDDLEデモ

于 2013-02-01T09:33:53.357 に答える
0
<div>
    <input type="checkbox" name="box1" >
    <input type="checkbox" name="box2" >
    <input type="checkbox" name="box3" >
</div>

$('input[name^="box"]').click(function() {
    if($(this).is(":checked"))
        $(this).siblings().attr('checked', false);
})

編集: JSFiddle

于 2013-02-01T09:26:07.127 に答える
0

:not() フィルターを使用して、クリックされたチェックボックスを除外できます。

$("input[type='checkbox']").click(function(){
    var name = $(this).attr("name");
    $("input[type='checkbox']:not(input[name='"+name+"'])").attr("disabled", "disabled");
});
于 2013-02-01T09:24:17.637 に答える
0

あなたはこれを試すことができます、

$('input:checkbox').click(function(){
        $('input:checkbox').not($(this)).attr("disabled", true);
    });
于 2013-02-01T09:28:31.813 に答える