jQuery iCheck Plugin 下处理复选框全选切换

最新推荐文章于 2021-02-19 10:44:49 发布

不务正业的野猴子

最新推荐文章于 2021-02-19 10:44:49 发布

阅读量278

点赞数

分类专栏： jQuery学习笔记

本文链接：https://blog.csdn.net/quan20111992/article/details/81356860

版权

jQuery学习笔记专栏收录该内容

15 篇文章 0 订阅

订阅专栏

jQuery iCheck Plugin 下全选的实现方式

 var $checkboxAll = $("#allCheck");
 var $checkbox = $("input:checkbox[name='check']").not("[disabled]");
 var length = $checkbox.length;
 var i=0;
 $checkboxAll.on("ifClicked",function(event){
     if(event.target.checked){
         $checkbox.iCheck('uncheck');
         i=0;
     }else{
         $checkbox.iCheck('check');
         i=length;
     }
 });
 $checkbox.on('ifClicked',function(event){
     event.target.checked ? i-- : i++;
     if(i==length){
         $checkboxAll.iCheck('check');
     }else{
         $checkboxAll.iCheck('uncheck');
     }
 })

注意：

event.target.checked

此处的checked 获取的是该元素在事件之前的状态

下面是原生的写法(不适用于jQuery iCheck Plugin)

$("#allCheck").click( function() {
    $('input[name="check"]' ).attr("checked", this.checked);
});
var $subBox = $("input[name='check']" );
$subBox.click( function(){
    $("#allCheck" ).attr("checked",$subBox.length == $("input[name='check']:checked" ).length ? true : false );
});