checkbox利用JQuery实现全选、反选的方法

来源:互联网 发布:筛子数据 编辑:程序博客网 时间:2024/06/06 01:48
  1. //复选框事件  
  2. //全选、取消全选的事件  
  3. function selectAll(){  
  4.     if ($("#SelectAll").attr("checked")) {  
  5.         $(":checkbox").attr("checked"true);  
  6.     } else {  
  7.         $(":checkbox").attr("checked"false);  
  8.     }  
  9. }  
  10. //子复选框的事件  
  11. function setSelectAll(){  
  12.     //当没有选中某个子复选框时,SelectAll取消选中  
  13.     if (!$("#subcheck").checked) {  
  14.         $("#SelectAll").attr("checked"false);  
  15.     }  
  16.     var chsub = $("input[type='checkbox'][id='subcheck']").length; //获取subcheck的个数  
  17.     var checkedsub = $("input[type='checkbox'][id='subcheck']:checked").length; //获取选中的subcheck的个数  
  18.     if (checkedsub == chsub) {  
  19.         $("#SelectAll").attr("checked"true);  
  20.     }  
  21. }

  1. <input type="checkbox" id="SelectAll"  value="全选" onclick="selectAll();"/>  
  2.   
  3. <input type="checkbox" id="subcheck"  value="1" onclick="setSelectAll();"/>  
  4. <input type="checkbox" id="subcheck"  value="2" onclick="setSelectAll();"/>  
  5. <input type="checkbox" id="subcheck"  value="3" onclick="setSelectAll();"/>  
  6. <input type="checkbox" id="subcheck"  value="4" onclick="setSelectAll();"/>  


原创粉丝点击