喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的。
官网: http://www.bootcss.com/p/icheck/
进入正题,iCheck提供了一些方法,可以进行全选和反选的判定。
ifChecked:输入框的状态变为 checked
ifUnchecked:checked 状态被移除
ifChanged:输入框的 checked 或 disabled 状态改变了
var checkAll =$('input.all'); //全选的input var checkboxs =$('input.check'); //所有单选的input checkAll.on('ifChecked ifUnchecked',function(event){ if(event.type == 'ifChecked'){ checkboxs.iCheck('check'); }else{ checkboxs.iCheck('uncheck'); } }); checkboxs.on('ifChanged',function(event){ if(checkboxs.filter(':checked').length == checkboxs.length){ checkAll.prop('checked',true); }else{ checkAll.prop('checked',false); } checkAll.iCheck('update'); })
PS:其实本人是很讨厌bootstrap的,奈何公司。。。;
之前不知道怎么写,看了各个网站,发现他们判断状态改变是这样写的
removeProp()这个方法我认为不太好,会出现无法移除的bug,说到这里就有点生气了,你说你分享你的知识的时候都不测试的吗???昂!
removeProp()用于移除由 prop() 添加的属性,不要使用该方法来移除诸如 style、id 或 checked 之类的 HTML 属性。
可以用removeAttr(),或者 prop('checked',false)替代;
*removeAttr() 这个好像也是有点问题的,自行试试。