Question

我调整了以下jsfiddle：http://jsfiddle.net/16bmcr6d/4/

这是我到目前为止的代码：

$(document).ready(function () {

(function ($) {

    $('#filter').keyup(function () {

        var rex = new RegExp($(this).val(), 'i');
        $('.searchable tr').hide();
        $('.searchable tr').filter(function () {
            return rex.test($(this).text());
        }).show();

    })

}(jQuery));

});

如果选中此复选框后，如何进一步调整以隐藏所有余额？

<label><input id="filter2" type="checkbox" checked="">Filter zero balances</label>

另外如何存储此值，以便下次加载页面时仍然会选中复选框？

在选中复选框的示例中，只显示Pound和Georgian Liari。

Answer 1

我调整了你的小提琴，让你知道如何做到这一点：

updated Fiddle

filter - 函数基本上只返回DOM - 传递的匿名函数返回true的元素，所以在这种情况下，你只需要提供一个拟合函数，例如：

return $(this).find('td').eq(3).text() !== "0"

使用.find('td').eq(3)我只需选择存储余额的td - 元素，即表格行中的第四个td（.eq为零 - 基于索引）

在复选框上触发change - 事件时执行的整个代码：

$('#filter2').on('change', function(){

    if(this.checked){
        $('.searchable tr').hide();
        $('.searchable tr').filter(function() {
            return $(this).find('td').eq(3).text() !== "0"
        }).show();
    }else{
        $('.searchable tr').show();
    }            

});

有多种方法可以将复选框的状态保留在各个会话中，例如，可以使用Cookies或类似LocalStorage的内容。

带有复选框的bootstrap表过滤器

1 个答案: