使用输入过滤表行

Question

在查看了有关此问题的其他一些 SO 问题后，我仍然无法弄清楚如何使其在我的情况下发挥作用。我有一个表格，上面有几行，上面有一个输入控件，我需要根据输入的内容进行过滤。每行都有一个删除按钮，我没有在我的 jsFiddle 中连接。这在我的真实页面上运行良好。

我的主要问题是过滤器本身。它肯定没有正确过滤，我不知道如何考虑删除按钮。当我开始输入过滤器时，我需要做什么，按钮文本（“删除”）将被忽略并且行将正确过滤？

这是一个半工作的jsFiddle，我所说的“半工作”是指，如果你输入字母“r”，所有内容都会被过滤掉，但只有一行。您键入的大多数其他字母都会被过滤掉。

过滤代码

<script>
$("#searchFilter").keyup(function () {
    var data = this.value.split(" ");
    var tbl = $("#table1").find("tr");
    if (this.value == "") {
        tbl.show();
        return;
    }
    tbl.hide();
    tbl.filter(function (i, v) {
        var t = $(this);
        for (var d = 0; d < data.length; d++) {
            if (t.is(":contains('" + data[d] + "')")) {
                return true;
            }
        }
        return false;
    }).show();
});
</script>

多亏了这篇文章，我才得以开始，但现在卡住了……：https://stackoverflow.com/a/17075148/738262

工作代码

jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
    return function( elem ) {
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});

$("#searchFilter").keyup(function () {
    var data = this.value.split(" ");
    var tbl = $("#table1").find("tr");
    if (this.value == "") {
        tbl.show();
        return;
    }
    tbl.hide();
    tbl.filter(function (i, v) {
        var t = $(this);
        for (var d = 0; d < data.length; d++) {
            if (t.is(":Contains('" + data[d] + "')")) {
                return true;
            }
        }
        return false;
    }).show();
});

Answer 1

:contains 区分大小写。当您输入r 时，它找不到Running，只有Bar。

同样在for 循环中应该是d++。