首页>>Jquery文字>>无刷新模糊搜索表格数据(2021-11-03)

无刷新模糊搜索表格数据

无刷新模糊搜索表格数据
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="content">  
  2.     无刷新搜索<input type="text" id="lin" placeholder="请输入需要搜索的内容">  
  3.   
  4.     <table id="table-1" cellspacing='0' border="1" style="text-align: center;">  
  5.       <tr>  
  6.         <th>姓名</th>  
  7.         <th>性别</th>  
  8.         <th>年龄</th>  
  9.         <th>电话</th>  
  10.         <th>地址</th>  
  11.       </tr>  
  12.   
  13.       <tr>  
  14.         <td>赵一</td>  
  15.         <td>男</td>  
  16.         <td>28</td>  
  17.         <td>1234567891</td>  
  18.         <td>上海</td>  
  19.       </tr>  
  20.       <tr>  
  21.         <td>钱二</td>  
  22.         <td>女</td>  
  23.         <td>28</td>  
  24.         <td>1234567892</td>  
  25.         <td>北京</td>  
  26.       </tr>  
  27.       <tr>  
  28.         <td>孙三</td>  
  29.         <td>女</td>  
  30.         <td>25</td>  
  31.         <td>1234567893</td>  
  32.         <td>广州</td>  
  33.       </tr>  
  34.       <tr>  
  35.         <td>李四</td>  
  36.         <td>女</td>  
  37.         <td>26</td>  
  38.         <td>1234567894</td>  
  39.         <td>深圳</td>  
  40.       </tr>  
  41.     </table>  
  42.   </div>  

 

JavaScript Code
  1. <script type="text/javascript">  
  2.     var table = document.getElementById("table-1");  
  3.     var input = document.getElementById("lin")  
  4.   
  5.   
  6.     input.onkeyup = function () {  
  7.       new Search(table, input)  
  8.     }  
  9.   </script>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_922.html