Question

我正在使用Jquery DataTables（Datatables.net）和我的网格。假设我的网格总共有45个页面，因此目前默认分页为＆＃39; full_numbers＆＃39;显示以下按钮：

首先，最后，1,2,3,4,5，...，45，接着，最后

现在，当我点击第5页按钮时，分页会以这种方式显示按钮：

首先，上一页，1，...，4,5,6，...，45，接着，最后

我不想要那些省略号，我想要的是当用户点击第5页时，我想要显示接下来的3页以及1页面，如下所示：

首先，上一个，4,5,6,7,8，接着，最后

所以最终我要删除省略号，并以此格式显示上一页码，当前页码和下一页n号：

首先，上一页，{上一页}，{当前页面}，{下一页3页}，下一页，上一页

有没有办法让它在DataTables中成为可能？

Answer 1

问题

默认情况下，DataTables 1.10.7的最新版本没有此功能。

有pagination plug-ins提供了额外的功能，但不幸的是，它们都没有提供此功能。

解

我们创建了分页插件“Full Numbers - No Ellipses”和“Simple Numbers - No Ellipses”来克服这个问题并显示没有省略号的分页控件。

“Full Numbers - No Ellipses”插件的行为与分页选项'pagingType': 'full_numbers'类似，但不包括省略号。
“简单数字 - 无省略号”插件的行为与分页选项'pagingType': 'simple_numbers'类似，但也会排除省略号。

样本

请参阅example of Full Numbers – No Ellipses plug-in进行演示并下载两个插件。

如何使用

使用“Simple Numbers - No Ellipses”插件：

下载simple_numbers_no_ellipses.js
在jquery.dataTables.min.js
使用'pagingType': 'simple_numbers_no_ellipses'初始化选项。

使用“Full Numbers - No Ellipses”插件：

下载full_numbers_no_ellipses.js
在jquery.dataTables.min.js
使用'pagingType': 'full_numbers_no_ellipses'初始化选项。

例如：

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.1.min.js"></script> 
<script type="text/javascript" src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.css">

<script type="text/javascript" src="full_numbers_no_ellipses.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        $('#example').DataTable( {
            'pagingType': 'full_numbers_no_ellipses'
        } );
    } );
</script>

如何在Jquery DataTables分页中删除省略号？

1 个答案:

问题

解

样本

如何使用