使用全選腳本過濾表

Question

我正在使用此 （ 此處的文件 ）腳本，並且正在使用第一行中的所有腳本檢查我的復選框。 但是首先，當我篩選列時，此腳本也選擇了隱藏行中的復選框。

$(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);
    }
});
});

感謝您的幫助。

Answer 1

使用jQuery :visible選擇器可以忽略已過濾的復選框。 https://api.jquery.com/visible-selector/

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

Answer 2

是的 我的新代碼：

$(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);
    }
});
});

謝謝大家...