jQuery表格模糊搜索特效代码下载


jQuery表格模糊搜索特效代码下载
jQuery表格模糊搜索特效代码下载以及表格模糊搜索等js/jquery网页特效代码下载。

1. 引入JS

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/lin_search.js"></script>

2. HTML代码

  <div class="content">
    <input type="text" id="lin" placeholder="请输入需要搜索的内容">
    <table id="table-1" cellspacing='0' border="1" style="text-align: center;">
      <tr>
        <th>姓名</th>
        <th>性别</th>
        <th>年龄</th>
        <th>电话</th>
        <th>地址</th>
      </tr>
      <tr>
        <td>林兵</td>
        <td>男</td>
        <td>18</td>
        <td>12345678941</td>
        <td>富顺</td>
      </tr>
      <tr>
        <td>赖玉英</td>
        <td>女</td>
        <td>18</td>
        <td>12345678942</td>
        <td>南充</td>
      </tr>
      <tr>
        <td>潘旭</td>
        <td>女</td>
        <td>20</td>
        <td>12345678912</td>
        <td>富顺</td>
      </tr>
      <tr>
        <td>王威平</td>
        <td>男</td>
        <td>20</td>
        <td>97543152146</td>
        <td>广元</td>
      </tr>
      <tr>
        <td>李丹</td>
        <td>女</td>
        <td>30</td>
        <td>14725836910</td>
        <td>江安</td>
      </tr>
      <tr>
        <td>陈志樑</td>
        <td>男</td>
        <td>20</td>
        <td>31546287451</td>
        <td>富顺</td>
      </tr>
      <tr>
        <td>郭仕宏</td>
        <td>男</td>
        <td>20</td>
        <td>51240316845</td>
        <td>南充</td>
      </tr>
    </table>
  </div>
  <script type="text/javascript">
    var table = document.getElementById("table-1");
    var input = document.getElementById("lin")
    input.onkeyup = function () {
      new Search(table, input)
    }
  </script>
<div style="text-align:center;margin:-150px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>

相关推荐

发表评论

相关文章