0

当检查/未选中其他任何复选框时，我想禁用/启用加上检查/未选中的第一个复选框。

我可以先禁用/启用但没有选中/取消选中它，它也不能完全按预期工作，它在选中/取消选中第一个复选框后挂起。

结果预期。

当检查第一个选中的任何复选框时，应禁用/启用第一个复选框加上检查/未选中。

当第一个被选中/取消选中时，禁用/启用其余所有复选框。

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);
    }
});

});

jsFiddle

请查看并提出建议的方法。谢谢。

4

2 回答 2

1

您必须检查不是第一个复选框的复选框组：

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

演示：http: //jsfiddle.net/rUm9j/7/

于 2013-07-02T13:11:51.620 回答
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 回答