我试图在一个HTML5页面上搜索每个,然后隐藏,如果没有匹配。我是'几乎',但不完全有。到目前为止,我会消失,如果有一个字符匹配,但然后重新出现,如果我键入任何其他内容。此外,我希望页面重置,如果我清除搜索框。真的很感激,如果你Java的家伙可以看看。
function myFunction() {
input = document.getElementById("Search");
filter = input.value.toUpperCase();
for (i=0; i<document.getElementsByClassName('target').length; i++){
if(document.getElementsByClassName('target'[i].innerHTML.toUpperCase().indexOf(filter) > -1) {
document.getElementsByClassName("target")[i].style.display = "none";
}
else{
document.getElementsByClassName("target")[i].style.display = "";
}
}
}
</script>
<table align="center" width="20%">
<tr>
<td style="padding-right: 10px">
<input type="text" id="Search" onkeyup="myFunction()"
placeholder="Please enter a search term.." title="Type in a name">
</td>
</tr>
</table>
<br>
<div class="target">
This is my DIV element.
</div>
<div class="target">
This is another Div element.
</div>
6条答案
按热度按时间1l5u6lss1#
这就对了。使用了适合您需要的
includes
方法。xeufq47z2#
您的代码工作得很好!
把你的如果,否则
你的如果...其他应该是这样的
一个二个一个一个
6kkfgxo03#
你可以把
toggle
和搜索字符串结合起来,效果很好。5n0oy7gb4#
7tofc5zh5#
添加到Oen44的答案-如果你想添加一个“no results found”消息,当查询没有在任何搜索元素中找到,这是工作:
JavaScript语言:
超文本:
dojqjjoe6#
我正在使用此搜索代码进行bootstrap accordion搜索