嗨,我使用输入框对div进行了基本的文本搜索,但只有输入完整的完整单词后,我才能使其正常工作,如何修改此代码以使其适用于子字符串,例如如果我输入Test我想同时返回Test和Test2,或者Just T应该同时返回两者,等等?



//search site for pages
    	function search_sitemap() {
    	let input = document.getElementById('searchbar').value
    	input=input.toLowerCase();
            let x = document.getElementsByClassName('pages');
            var urls = [];

            for (i = 0; i < x.length; i++) {
                // make an array of strings
                var words = x[i].innerHTML.toLowerCase().split(",");
              if (!words.includes(input)) {
            	x[i].style.display="none";
        	}
          else {

                    x[i].style.display = "block";
                    urls.push(x[i].href);

        	}
            }

            return urls;
      }


		</script>

<!DOCTYPE html>
<html>
	<head></head>

<body>
	<header></header>

  <!--searchbar-->
  			<button class="searchbtn"><img src="Images\search.png" id="s-icon">
  			<div id='searchlist'>
  				<a class="pages" href="test.html" style="display:none;">Test</a></li>
          <a class="pages" href="test2.html" style="display:none;">Test2</a></li>
  				<a class="pages" href="best.html" style="display:none;">Best</a></li>
  				<a class="pages" href="rest.html" style="display:none;">Rest</a></li>
			</div>
			</button>
  			<div class="searchbar">
  				<input type="text" id="searchbar" onkeyup="search_sitemap()" placeholder="" value="Search.." maxlenght="25" autocomplete="off" onMouseDown="active();" onBlur="inactive()" />
  			</div>

	</div>
</body>
</html>

最佳答案

您可以检查某些单词是否以搜索开头:

words.some(word => word.startsWith(input))

07-24 19:19
查看更多