jQuery 过滤结果 - 奇异匹配

Question

我正在使用 jQuery 来过滤表行并且它有效。

但我注意到它以一种非常具体的方式找到了不应该的匹配。

这是我的 jQuery:

$("#searchInput").keyup(function() {
    var rows = $(".rows").find('tr').hide();
    var data = this.value.split("/");
    $.each(data, function(i, v) {
        rows.filter(":Contains('" + v + "')").show();
    });
});

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

这是我的数据:

John Smith  4500
Mike Green  1234
David Brown 8542
ID5004  5004
Mal Smith   6532

如果我搜索 1234，我只会得到 1234。如果我搜索 4500，我会得到 4500 和 5004。

我认为问题是由于内部文本被读取并且匹配:

约翰·史密斯 4500

ID5004 5004

我仍然希望能够搜索所有字段，但是是否可以限制匹配，使其找不到这样的条目？

我创建了一个 fiddle 这表明了问题。

谢谢

Answer 1

问题出在 jQuery(elem).text() 上，它将两个 tr td 的文本连接在一起，没有空格。 您可以改为检查 tr 的每个 td。 https://jsfiddle.net/ktriek/bsef5bLj/6/

jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
return function( elem ) {     
  var tds = jQuery(elem).find('td');
  return tds.eq(0).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0 ||
  tds.eq(1).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
};
});