如何在单个查询中搜索多个子字符串

Question

我遇到了一个我无法进一步思考的问题。 简而言之，我有一个ul 和数百个li，每个li 有几十个单词作为文本；在列表的最顶部，我放置了一个输入框，供用户输入一些关键字；例如，假设我想从那个巨大的列表中过滤掉同一行中存在以下三个单词的行：“red sweet strawberries”。点击搜索按钮后，这些行被过滤掉了，我只有两行包含我感兴趣的单词。

li1：“我迫不及待地想吃一些红甜草莓”

li2：“现在是夏天，红甜草莓现在很新鲜”

到目前为止一切都很好。

当三个查找的单词被字符串中的其他单词或字符分隔时，就会出现问题。 因此，以上面的示例为例，过滤器永远不会向我显示以下行：

li3：“红色和甜草莓现已上市”

所以，在这里我列出了过滤和整理上例中结果的整个函数：

$(document).ready(function() {
      var links = new Array();
      $("h4").each(function(index, element) {
      links.push({
            text: $(this).text(),
            element: element
        });
    });

    $("#searchbutton").click(function() {
        var query = $("#inputtext").val();
        var querywords = query.split(',');

        var results = new Array();
        for(var i = 0; i < querywords.length; i++) {
            for(var j = 0; j < links.length; j++) {
                if (links[j].text.toLowerCase().indexOf(querywords[i].toLowerCase()) > -1) {
                    results.push(links[j].element);                    
                    }
            }
        }

        $("h4").each(function(index, element) {
            this.style.display = 'none';
        });
        for(var i = 0; i < results.length; i++) {
            results[i].style.display = 'block';
        }

    });     

});

是否可以搜索多个子字符串并得到结果，即使子字符串之间用字符或其他单词分隔？

Answer 1

这是做我认为你想做的事情的一种方法。

var results = new Array();
for ( var i = 0; i < querywords.length; i++ ) {
    var regex = new RegExp( 
        '(?=.*\\b' + querywords[i].split(' ').join('\\b)(?=.*\\b') + '\\b)', 'i'
    );
    for ( var j = 0; j < links.length; j++ ) {
        if ( regex.test( links[j].text ) ) {
            results.push( links[j].element );
        }
    }
}

例如，如果querywords 包含项目"red sweet strawberries"，则创建的regex 将是

/(?=.*\bred\b)(?=.*\bsweet\b)(?=.*\bstrawberries\b)/i

使用三个正数look-aheads，以便在同一行包含三个单词的字符串通过测试（如果它们被单词边界包围）。

演示：JSFIDDLE.

Answer 2

如果我理解正确的话，整个问题是：

var querywords = query.split(',');

在示例查询中，您没有逗号。所以我想这是一个错误？用空格分割查询：

var querywords = query.split(' ');