使用select all脚本过滤表

时间:2015-09-29 22:43:02

标签: javascript jquery checkbox selectall

我正在使用thisfile here)脚本,我正在使用第一行中的所有脚本检查我的复选框。但首先,当我过滤一个列时,此脚本也会选中隐藏行的复选框。

$(document).ready(function(){
$('#select_all').on('click',function(){
    if(this.checked){
        $('.checkbox').each(function(){
            this.checked = true;
        });
    }else{
         $('.checkbox').each(function(){
            this.checked = false;
        });
    }
});

$('.checkbox').on('click',function(){
    if($('.checkbox:checked').length == $('.checkbox').length){
        $('#select_all').prop('checked',true);
    }else{
        $('#select_all').prop('checked',false);
    }
});
});

感谢您的帮助。

2 个答案:

答案 0 :(得分:0)

使用jQuery :visible选择器省略已过滤的复选框。 https://api.jquery.com/visible-selector/

$('#select_all').on('click',function(){
    var doCheck = this.checked;
    $('.checkbox:visible').each(function(){
         this.checked = doCheck;
    });
});

答案 1 :(得分:0)

呀。我的新代码:

$(document).ready(function(){
$('#select_all').on('click',function(){
    if(this.checked){
        $('.checkbox:visible').each(function(){
            this.checked = true;
        });
    }else{
         $('.checkbox:visible').each(function(){
            this.checked = false;
        });
    }
});

$('.checkbox:visible').on('click',function(){
    if($('.checkbox:checked').length == $('.checkbox:visible').length){
        $('#select_all').prop('checked',true);
    }else{
        $('#select_all').prop('checked',false);
    }
});
});

谢谢大家......