0

他のチェックボックスがオン/オフになっているときに、最初のチェックボックスをオン/オフにして、無効/有効にしたい。

最初に無効/有効にすることはできますが、チェック/チェックを外すことはできません.

結果が期待されます。

最初のチェックボックス以外のチェックボックスがチェックされている場合、最初のチェックボックスは無効/有効に加えて、チェック/チェック解除する必要があります。

最初の 1 つがチェックされている/チェックされていない場合は、残りのすべてのチェックボックスを無効/有効にします。

HTML

<form>
    <label><input name="search" value="all" type="checkbox" checked="checked" />All</label>
    <label><input name="search" value="Item1" type="checkbox" />Item1</label>
    <label><input name="search" value="Item2" type="checkbox" />Item2</label>
    <label><input name="search" value="Item3" type="checkbox" />Item3</label>
    <label><input name="search" value="Item4" type="checkbox" />Item4</label>
</form>

jQuery

$(function(){

$("input[name=search]:eq(0)").click(function(){
    if($(this).is(':checked')){
            $("input[name=search]").not(this).prop('disabled',true);
        } 
    else{
            $("input[name=search]").not(this).prop('disabled',false);
        }   
});

$("input[name=search]:not('input[name=search]:eq(0)')").click(function(){
    if($("input[name=search]").is(':checked')){
        $("input[name=search]:eq(0)").prop('disabled',true);
    }
        else{
        $("input[name=search]:eq(0)").prop('disabled',false);
    }
});

});

jsフィドル

それを行う方法を見て提案してください。ありがとう。

4

2 に答える 2

0 
<form>
<label><input name="search" value="all" type="checkbox" checked="checked" id="chkAll" />All</label>
<label><input name="search1" value="Item1" type="checkbox" />Item1</label>
<label><input name="search1" value="Item2" type="checkbox" />Item2</label>
<label><input name="search1" value="Item3" type="checkbox" />Item3</label>
<label><input name="search1" value="Item4" type="checkbox" />Item4</label>
</form>

$("#chkAll").click(function(){
    if($(this).is(':checked'))
    {
        $('input[name="search1"]').attr('disabled','disabled');
    }
    else
    {
        $('input[name="search1"]').removeAttr('disabled');
    }

});

$('input[name="search1"]').click(function(){
    if($('input[name="search1"]').is(':checked'))
{
    $("#chkAll").attr('checked',true);
     $('#chkAll').attr('disabled','disabled');
}
    else
    {
         $('#chkAll').removeAttr('disabled');
            $("#chkAll").attr('checked',false);
    }
});

デモ: http://jsfiddle.net/rUm9j/6/

于 2013-07-02T13:33:08.477 に答える