jQuery复选框问题 [英] Jquery checkbox problem

问题描述

这是我的复选框

<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]尝试检查其他无法选中全部"的复选框

As per this code one senario is not working 1] try to check other checkboxes not able to check All

$("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") );  
});

推荐答案

使用ID作为复选框，然后使用上述方法，因为#是ID选择器.

Use ids for the checkboxes and then use the above method since # is an id selector.

或者您可以使用

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

请参见 attributeEquals选择器

已编辑

Edited

$(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

当所有其他复选框都选中时，这将选中所有复选框.如果未选中任何一个，则所有复选框都将被取消.

This will check the checkbox All when all other checkboxes are checked. And if any one is unchecked then checkbox All will be unchecked.

这篇关于jQuery复选框问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！