jquery - 使用 jQuery 测试子项是否包含特定文本

Question

我必须过滤一个 html 表。为此，我为所有tr元素创建了一个 each 回调，并测试其中一个是否tr-children包含某些特定模式。

$("#filter").keypress(function() {
    var filter = $(this).val();

    $("#table1 tr[data-config]").each(function(){

        var val = $(this).find(":contains('" + filter + "')");

        if(val.length > 0){
            $(this).css("display","table-row");
        }else{
            $(this).css("display","none");
        }
    });
});

它可以工作，但是是否有一个功能可以测试元素是否包含一些文本？

目前，我检索包含该模式的所有元素的列表，并计算它是否大于零。是否有一个 jQuery 函数来测试这种模式是否发生并返回一个布尔值？该表可以包含许多行，因此我希望尽可能少的开销。

Answer 1

///// replace these lines...
// var val = $(this).find(":contains('" + filter + "')");
// if(val.length > 0){

///// with this line
if($(this).text().match(filter)){

这通过将整行内容转换为文本字符串，然后使用简单的字符串比较函数来检查过滤器是否包含在文本中（因此行）

Answer 2

答案很好，但是使用 :contains 有一种更简单的方法

一般来说，这样做：

$(".class:contains('texttofind')").css("display", "none");

使用上面的具体示例，请执行以下操作：

$("#table1 tr[data-config]:contains('" + filter + "')").css("display","table-row");

您可以在此处了解更多信息：https ://api.jquery.com/contains-selector/

这避免了循环使用.eachor .find。

Answer 3

当过滤器区分大小写时，这是使其不区分大小写的方法：

.match("/pattern/i"); 

_{比利的道具！}