首页 > Web开发 > 详细

JQuery实现 checkbox 全选、反选,子checkbox有没选去掉全选

时间:2014-03-14 17:10:24      阅读:490      评论:0      收藏:0      [点我收藏+]

1. 全选的checkbox选中时,子checkbox全部选中。反之,全部不选

2.子checkbox中,只要有没有被选中的,取消全选checkbox的选中

3.子checkbox的数量和子checkbox被选中的数量一样时,全选checkbox要被选中

$("input:checkbox) 相当于 $("input[type=‘checkbox‘]

 

[javascript]

//全部选择
$("#checkall").click(function(){
  $("input:checkbox[name=‘checkbox[]‘][disabled=false]").attr("checked", $(this).attr("checked"));
});
//点击判断是否全选
$("input:checkbox[name=‘checkbox[]‘]").click(function(){
  if (!$("input:checkbox[name=‘checkbox[]‘]").checked) {
    $("#checkall").attr("checked", false);
  }
  var sumcheckbox = $("input:checkbox[name=‘checkbox[]‘]").length; //获取[name=‘checkbox[]‘]的个数
  var sumchecked = $("input:checkbox[name=‘checkbox[]‘]:checked").length; //获取选中的[name=‘checkbox[]‘]的个数
  if (sumchecked == sumcheckbox) {
    $("#checkall").attr("checked", true);
  }
});

 

 

 


页面代码如下:

 

[html]
 
  1. <input type="checkbox" id="checkall"  value="全选" />   
  2. <input type="checkbox"  name="checkbox[]  value="1" />  
  3. <input type="checkbox"  name="checkbox[] value="2" />  
  4. <input type="checkbox"  name="checkbox[]  value="3" />  
  5. <input type="checkbox"  name="checkbox[]  value="4" />  

JQuery实现 checkbox 全选、反选,子checkbox有没选去掉全选,布布扣,bubuko.com

JQuery实现 checkbox 全选、反选,子checkbox有没选去掉全选

原文:http://www.cnblogs.com/gaoyinghui/p/3600078.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!