jquery - 使用 Jquery 过滤表行

Question

我发现一个 Jquery 脚本可以根据输入字段进行表过滤。该脚本基本上采用过滤器，分割每个单词并使用每个单词过滤表行。因此，最后您将得到一个包含输入字段中所有单词的行列表。

http://www.marceble.com/2010/02/simple-jquery-table-row-filter/

var data = this.value.split(" ");

$.each(data, function(i, v){
     jo = jo.filter("*:contains('"+v+"')");
});

现在，我需要的是过滤包含输入字段中每个单词的行。我想过滤输入字段中至少包含一个单词的所有行。

我尝试过的一种方法是将每个过滤列表放入一个数组中......

  var rows = new Array();

 $.each(data, function(i, v){
     rows[i] = jo.filter("*:contains('"+v+"')");
 });

在这个阶段，我必须对“rows”数组中的所有行进行联合并显示它们。我不知道如何准确地做到这一点。

上面的脚本正在运行 - http://marceble.com/2010/jqueryfilter/index.html?TB_iframe=true&width=720&height=540

如果我在过滤器中输入“cat 6”，我想显示三行。

Answer 1

看看这个 jsfiddle .

这个想法是使用循环单词的函数来过滤行。

jo.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 the rows that match.
.show();

编辑:请注意，使用 :contains() 选择器无法实现不区分大小写的过滤，但幸运的是有 text()函数，因此过滤字符串应为大写，并将条件更改为 if ($t.text().toUpperCase().indexOf(data[d]) > -1)。看看这个jsfiddle .