javascript - Jquery复选框问题

Question

嗨，这是我的复选框

<table cellpadding="0" cellspacing="0" border="1" bordercolor="red" width="100%" >
<tr><td width="50%"><input type="checkbox" name="businessTypeGroup" id="chkAll" value="0" >All</TD><TD><input type="checkbox" name="businessTypeGroup" id="chkBuyer" value="1">Buyer/Importer</td></tr>
<tr><td><input type="checkbox" name="businessTypeGroup" id="chkSeller" value="2">Seller/Exporter/Manufacturer</TD><TD><input type="checkbox" name="businessTypeGroup" id="chkService" value="3">Service Provider</td></tr>                          
<tr><td><input type="checkbox" name="businessTypeGroup" id="chkDistributor" value="4">Distributor</td><td><input type="checkbox" name="businessTypeGroup" id="chkSupplier" value="5">Supplier</TD></tr>
<tr><td colspan="2"><input type="checkbox" name="businessTypeGroup" id="chkTrading" value="6">Trading Company&nbsp;<span id="businessTypeGroupError"></td></tr>
</table>

根据此代码，一个 senario 不起作用 1]尝试勾选其他无法勾选全部的复选框

$("input:checkbox[name='businessTypeGroup']").click (function(){
$("input:checkbox[name='businessTypeGroup']").click (function(){
var totalCheckboxes = $("input:checkbox[name='businessTypeGroup']").length;         
var checkedCheckboxes = $("input:checkbox[name='businessTypeGroup']:checked").length;
    if ( totalCheckboxes === checkedCheckboxes ){               
        $("#chkAll").attr("checked" , true );   
    }else{
        $("#chkAll").attr("checked" , false );
    }   
   });
 });

 $("#chkAll").click ( function(){
   $("input:checkbox[name='businessTypeGroup']").attr ( "checked" , $(this).attr("checked") );  
});

Answer 1

使用 ids 作为复选框，然后使用上述方法，因为 # 是一个 id 选择器。

或者你可以使用

$(function(){
    $("input:checkbox[name='businessTypeGroup']").click (function(){
        alert("test");
    });
});

参见attributeEquals selector

已编辑

$(function(){
    $("input:checkbox[name='businessTypeGroup']").click (function(){
        $("#chkAll").attr ( "checked" , false );
});

$("#chkAll").click ( function(){
    $("input:checkbox[name='businessTypeGroup']").attr ( "checked" , $(this).attr ( "checked" ) );  
    });
});

<input type="checkbox" id="chkAll" value="0" >All
<input type="checkbox" id="chkBuyer" name="businessTypeGroup"  value="1" >Buyer/Importer
<input type="checkbox" id="chkSp" name="businessTypeGroup"  value="2" >Service Provider
<input type="checkbox" id="chkSupp" name="businessTypeGroup"  value="3" >Supplier

<强> Working Demo

<强> Another demo

当选中所有其他复选框时，这将选中“全部”复选框。如果取消选中任何一项，则“全部”复选框将被取消选中。