在输入框中键入时如何过滤列表选项？
[英]How to I filter list options when typing on a input box?
问题描述
在 HTML 中，我有一个输入框和它下面的一些无序列表项。 当用户开始在输入框中输入时，我希望最相关的列表项移到顶部，并且不相关的项消失。 （几乎就像自动完成表单或 Google 搜索）我如何仅使用 Javascript 执行此操作？
1 个解决方案
解决方案1
1 2018-09-21 22:03:42
嗨@blueWater 你能试试这个吗？ 它可能会解决您的问题
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <h2>My Phonebook</h2> <input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name"> <ul id="myUL"> <li><a href="#">Billy</a></li> <li><a href="#">Bob</a></li> <li><a href="#">Adele</a></li> <li><a href="#">Agnes</a></li> <li><a href="#">Calvin</a></li> <li><a href="#">Christina</a></li> <li><a href="#">Cindy</a></li> </ul> <script> function myFunction() { var input, filter, ul, li, a, i; input = document.getElementById("myInput"); filter = input.value.toUpperCase(); ul = document.getElementById("myUL"); li = ul.getElementsByTagName("li"); for (i = 0; i < li.length; i++) { a = li[i].getElementsByTagName("a")[0]; if (a.innerHTML.toUpperCase().indexOf(filter) > -1) { li[i].style.display = ""; } else { li[i].style.display = "none"; } } } </script> </body> </html>
在输入框中输入搜索查询时，如何使搜索功能正常工作？
[英]How can I get search functionality to work when typing in search queries in the input box?
当我在下面的代码中在jQuery中输入内容时，如何过滤复选框？
[英]how to filter my check box when I write in input in jquery in below code?
在HTML输入框中输入数字后，如何调用运行的AJAX？
[英]How do I call AJAX that runs after I finish typing a number in the HTML Input box?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.