过滤表与分页

我想要一个带有分页的表,同时在表头中搜索框。 所以使用这个代码jsfiddle分页

我想要像这样的输出: 在此处输入图像描述

这是我的过滤代码:

function searchCabinet() { var input, filter, table, tr, td, i; input = document.getElementById("searchCabinet"); filter = input.value.toUpperCase(); table = document.getElementById("myTable"); tr = table.getElementsByTagName("tr"); for (i = 0; i  -1) { tr[i].style.display = ""; } else { tr[i].style.display = "none"; } } } } 

在每个分页后过滤总行数,如下所示:

 $table.find('tbody tr').hide(); $filteredRows = $table.find('tbody tr').filter(function(i, tr) { return $('#search').val() != "" ? $(tr).find("td").get().map(function(td) { return $(td).text(); }).filter(function(td){ return td.indexOf($('#search').val()) != -1; }).length > 0 : true; }); 

然后显示当前页面的行:

 $filteredRows.slice(currentPage * numPerPage, (currentPage + 1) * numPerPage).show(); 

然后更改页数:

 var numRows = $filteredRows.length; var numPages = Math.ceil(numRows / numPerPage); 

检查工作小提琴