我在表中使用 Bootstrap 使用客户端分页。我想在每个页面中添加序列号,这样在第 1 页上的 S.No 从 1 到 50 开始,然后在第 2 页上的 s.No 应该是 51 到 100。 ……等等
我改变了我的CSS
.table {
counter-reset: serial-number; /* Set the serial number counter to 0 */
}
.table td:first-child:before {
counter-increment: serial-number; /* Increment the serial number counter */
content: counter(serial-number); /* Display the counter */
}
但现在问题出在第 2 页上,S.No 再次从 1 开始到 50,所以在第 3 页上。有人可以帮助我在其他页面上获得正确的序列号系列。
最佳答案
您可以在 counter-reset
属性中手动设置计数器:
counter-reset: serial-number 50; /* Set counter to 50 */
当然,您必须手动计算这个初始值。在 javascript 分页回调中,您可以使用以下内容更新它:
document.querySelector('.table').style.counterReset = 'serial-number ' + (zeroIndexedPageNo * pageSize);
关于javascript - 每页上的序列号相同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33472036/