javascript - 在分页中过滤文本字段 Jquery

Question

嗨，我是 html javascript 的新手，jquery 任何帮助都将不胜感激我设法创建了一个具有过滤器输入的表，但我的问题是当我输入搜索框并且我的过滤器但是当我退格直到文本字段为空时它显示表格的整行我的分页不起作用，因为在我第一次加载时没有在输入文本字段表中搜索显示两行并且有数字页面下一个按钮仅显示每页两行但是如果我过滤搜索并使我的字段为空它不会限制它将显示所有行的行就像现在我有六行它将显示六行我希望它只有两行显示并且当再次单击下两行时*链接分页-> https://www.jqueryscript .net/table/Client-side-HTML-Table-Pagination-Plugin-with-jQuery-Paging.html *

HTML

 

<table  id="myTable">
    <thead>
        <tr>
            <th>Firstname</th>
            <th>Amount</th>

        </tr>
    </thead>
    <tbody>
        <tr>
            <td>John</td>
            <td>100</td>

        </tr>
        <tr>
            <td>Mary</td>
            <td>200</td>

        </tr>
        <tr>
            <td>July</td>
            <td>300</td>

        </tr>
        <tr>
            <td>Juy</td>
            <td>3000</td>

        </tr>
        <tr>
            <td>uy</td>
            <td>1000</td>

        </tr>
    <tr>
            <td>buy</td>
            <td>10700</td>

        </tr>
    </tbody>
</table>

Javascript

$(document).ready(function(){
$("#myInput").on("keyup", function() {
    var value = $(this).val().toLowerCase();
    $("#myTable tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });

      $('#myTable').paging({
        limit: 2,
        rowDisplayStyle: 'block',
        activePage: 0,
        rows: []
    });  });

标签： javascriptjqueryhtmlcss