jquery实现简单搜索$("p:contains()")
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery实现简单搜索$("p:contains()")相关的知识，希望对你有一定的参考价值。
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>contains</title> <script src="./js/jquery.min.js"></script> </head> <body> <input type="text" id="search"> <button id="sub">搜索</button> <table width="100%" border=1> <tr> <th>ID</th> <th>姓名</th> <th>性别</th> <th>邮箱</th> <th>地区</th> </tr> <tr> <td>1</td> <td>张三</td> <td>男</td> <td>[email protected]</td> <td>北京</td> </tr> <tr> <td>2</td> <td>李四</td> <td>男</td> <td>[email protected]</td> <td>北京</td> </tr> <tr> <td>3</td> <td>张五</td> <td>女</td> <td>[email protected]</td> <td>上海</td> </tr> <tr> <td>4</td> <td>赵四</td> <td>男</td> <td>[email protected]</td> <td>深圳</td> </tr> </table> </body> <!-- <script></script>放在body的后面，但是它会自动地放到body的里面 --> <script src="./js/a1.js"> $("#sub").click(function() { var val = $("#search").val(); // 获取搜索词 if (val.length > 0) { $("tr:not(:first)").hide(); // 除了第一行外的所有行隐藏 $("tr:contains(" + val + ")").show(); // 包含搜索词的行显示 } else { $("tr").show(); } }); </script> </html>
以上是关于jquery实现简单搜索$("p:contains()")的主要内容，如果未能解决你的问题，请参考以下文章