如何自动从一个页面移动到另一个页面，然后回到 html 表格中分页的第一页

How to do automoving from one page to another page and back to first page where pagination is there in table in html

本文关键字：然后 html 表格 第一页 分页 移动 何自动 一个 另一个      更新时间：2023-09-26

我正在尝试为HTML中的表格添加带有分页的自动移动。例如，我有 100 行的表格，然后我正在对它进行分页，一页上有 10 条记录。因此，将有 10 页，每页 10 条记录。我不想自动执行此操作，以便用户不必专门单击页面即可查看。

我使用了分页.js

使用以下代码 

  <style type="text/css">
  .paging-nav {
  text-align: right;
  padding-top: 2px;
  }
  .paging-nav a {
  margin: auto 1px;
  text-decoration: none;
  display: inline-block;
  padding: 1px 7px;
  background: #91b9e6;
  color: white;
  border-radius: 3px;
  }
  .paging-nav .selected-page {
  background: #187ed5;
  font-weight: bold;
  }
  .paging-nav,
  #tableData {
  'width: 400px;
  margin: 0 auto;
  font-family: Arial, sans-serif;
  }
  </style>
  $(document).ready(function() {
  $('#file').paging({limit:10});
  });

这里的文件是要分页的表的 id。如何自动更改表格页面？欢迎所有答案。

这是一个如何开始的例子。请注意，这只是一个例子，不要复制！ 为了保护自己

//create
el = $("<table></table>");
for (var i = 1; i !== 100; i++) {
  el.append("<tr><td>" + i + "</td><td>buuurp</td></tr>");
}
el.data("intStart", 1);
el.appendTo("body");
//fuction
function showRow(j = 10) { //default var j = 10; you can call showRow(50) for 50 as example
  var i = $("table").data().intStart; //grabs data that hold the number of currect first element to view
  $("tr").hide();
  // hides all
  $("tr").filter(function(index) {
    return index >= i - 1 && index < i + j - 1; //jquery has 0-9 we count in 1-10 so -1
  }).show(); //shows the one needed
  $("table").data().intStart += j; //addes 'j' to the counter
  if ($("table").data().intStart > $("table").children("tr").lenght) {
    clearInterval(timer); //if we reach the end we can kill this
  }
}
showRow();
var timer = setInterval(function() {
  showRow();
}, 3000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

相关文章：