Question

我正在尝试构建一个搜索功能，其中搜索包括搜索中的所有单词。例如，如果我有3个项目：

红房子红车汽车的家用车库

在搜索框中（键入时当前是动态的），如果键入Red，则会得到上面的前两个。如果我键入Red，Car，我应该只得到第二行，即The Red Car，因为那是唯一同时包含红色和car的那个。

我尝试构建搜索项的数组，然后将其用于搜索框：

<div class="myButtons">
  <div class="btn-group" id="MatchingEntitiesButtons">

    <button id="Button1" class="roundBtns" onclick="togglediv('NamesTable')" type="button"> List of Names </button>

    <button id="Button2" class="roundBtns" onclick="togglediv('PhoneTable')" type="button"> List of Address </button>

    <button id="Button3" class="roundBtns" onclick="togglediv('AddressTable')" type="button"> List of Phone#</button>

    <button id="Button4" class="roundBtns" onclick="togglediv('GradesTable')" type="button"> List of Grades</button>

    <button id="Button5" class="roundBtns" onclick="togglediv('SchoolTable')" type="button"> List of Schools </button>

  </div>
</div>

<div id="NamesTable" class="TableBody" style="display:none">Names </div>
<div id="PhoneTable" class="TableBody" style="display:none">Address </div>
<div id="AddressTable" class="TableBody" style="display:none">Phone# </div>
<div id="GradesTable" class="TableBody" style="display:none">Grades </div>
<div id="SchoolTable" class="TableBody" style="display:none">School </div>

现在使用该代码，它只会将搜索结果的最后一个单词提供给我...如果我删除并添加单词，它似乎无法正确响应。

不确定我离这有多远。

Answer 1

您应该使用Array.prototype.every来检查每个单词是否通过测试。您还可以在循环之前提取小写标记，这样就不必在每个循环上都进行不必要的操作：

const lowerTags = item.tags.toString().toLowerCase();
const arr = str.toString().split(' ');
const haveAll = arr.every(wordToFind => lowerTags.includes(wordToFind.toLowerCase()));
return haveAll;

如果str已经是一个字符串，则无需在其上调用toString()（对于item.tags也是如此）-可能会使代码更具可读性。

Answer 2

以下脚本包含可搜索字符串的数组。调用Search函数时，它接受字符串作为参数。该字符串被拆分为该字符串中各个单词的数组元素。然后，该函数循环遍历每个搜索词并将其与每个可搜索项进行比较。如果项目和术语匹配，则将术语推入结果数组，该函数将返回给您以供您视需要使用。

<script>

searchableItems = [
    "The Red House",
    "The Red Car",
    "Home Garage For Your Car"
];


Search("Red");

function Search(searchTerm){
    results = [];

    searchWords = searchTerm.split();

    i = 0;
    while(i < searchWords.length){
        j = 0;
        while(j < searchableItems.length){

            if(searchableItems[j].indexOf(searchWords[i]) > -1){

                results.push(searchableItems[j]);
            }

            j++;
        }

        i++;
    }

    return results;
}

</script>

尝试搜索搜索的子集或包含所有关键字的搜索

2 个答案: