jquery - 如何在 jQuery DataTable 分页中显示所有页码

标签 jquery jquery-plugins datatables

如何在 jQuery 数据表分页中显示所有页码? 例如,我想要 1 2 3 4 5 6 7 8 9 10,而不是 1 2 3 ... 10

我现在的代码是这样的:

$('.paginated-table').dataTable({
  "lengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
  "ordering": false,
  "info":     false,
  "bFilter": false,
  "sDom": "t<'row'<'col-md-12'p>>",
  "oLanguage": {
    "oPaginate": {
      "sNext": "",
      "sPrevious": "",
    }
  }
});

最佳答案

计算页面按钮的逻辑是 here :

var extPagination = DataTable.ext.pager;

function _numbers ( page, pages ) {
    var
        numbers = [],
        buttons = extPagination.numbers_length,
        half = Math.floor( buttons / 2 ),
        i = 1;

    if ( pages <= buttons ) {
        numbers = _range( 0, pages );
    }
    ...

    numbers.DT_el = 'span';
    return numbers;
}

因此,您可以将 numbers_length 属性修改为更大的值(默认为 7),省略号将消失,显示所有页码:

$.fn.dataTableExt.pager.numbers_length = 600;

for (var i = 0; i < 500; ++i) {
  $("tbody").append("<tr><td>" + i + "</td><td>" + Math.random() + "</td></tr>");
}

$.fn.dataTableExt.pager.numbers_length = 600;

$("table").dataTable({
  ordering: false,
  info: false,
  bFilter: false,
  extPagination: {
    numbers_length: 600
  }
});
a {
  margin: 10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
<table border="1">
  <thead>
    <tr>
      <th>#</th>
      <th>Random numbers</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

关于jquery - 如何在 jQuery DataTable 分页中显示所有页码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27149409/

相关文章:

javascript - 将数据表导出到 excel 时提示用户输入文件名

javascript - 如何将键从对象推送到数组?

javascript - 带有左右按钮的图片库

javascript - jQuery 插件不适用于所有应用的元素

javascript - Flexslider startAt 选项和 directionNav 似乎冲突

aoCoulumn 中的 jquery 数据表 img

javascript - jquery数据表添加行未定义?

JavaScript AJAX 语法错误 : Unexpected token E in JSON at position 0

javascript - 保存已插入到 DOM 中的 jquery 对象

javascript - 如何使用jquery选择器获取没有id的内部div