Question

我遇到了一个我无法进一步思考的问题。简而言之，我有一个ul，其中有li，每个li有几十个单词作为文字;在列表的最顶部，我为用户输入了一个输入框，用于输入一些关键字;比方说，例如，我想从那个巨大的列表中过滤掉同一行中存在以下三个单词的行：“红色甜草莓”。点击搜索按钮，线条被过滤掉，我只有两行包含我感兴趣的单词。

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(' ');

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

2 个答案: