用下一个,上一个,最后一个和第一个按钮分页

时间:2018-06-11 15:39:57

标签: javascript jquery html css

我是jQuery的初学者,我尝试用下一个,上一个,第一个和最后一个按钮进行分页,但我不能。

这是我的代码:

<table className="table-container">
  <tbody>
    <tr className="row">
      <th className="header-row">First Name</th>
      <th className="header-row">Surname</th>
      <th className="header-row">Age</th>
      <th className="header-row">Town</th>
    </tr>
    <tr className="row">
      <td className="table-content">James</td>
      <td className="table-content">Stout</td>
      <td className="table-content">35</td>
      <td className="table-content">Camden</td>
    </tr>
    <tr className="row">
      <td className="table-content">Karen</td>
      <td className="table-content">Smith</td>
      <td className="table-content">40</td>
      <td className="table-content">Stevenage</td>
    </tr>
  </tbody>
</table>

1 个答案:

答案 0 :(得分:1)

目前还不是很清楚你在寻找什么,但我猜你想在你的分页链接中找到下一个/上一个链接。

首先非常简单 - 只需链接到索引为0的页面:

$("#pagin").append('<li><a href="#" class="hidden" data-index="0">first</a></li>');

同样最后只是页数的链接:

$("#pagin").append('<li><a href="#" class="hidden" data-index="'+pageCount+'">last</a></li>');

上一页/下一页需要您存储当前页面的内容:

https://jsfiddle.net/cfqx3ba6/