分页插件
DataTables 呈现给最终用户的分页选项的样式极大地影响了表格的外观和风格,当然还影响了交互行为。DataTables 有四个内置分页控件类型(pagingType
),你可以通过以下分页插件添加更多选项。
如何使用
要使用分页插件,你必须在加载 DataTables 库后,在初始化 DataTable 之前包含以下可用插件中的分页插件代码。在初始化 DataTable 时,你还必须设置 pagingType
为插件所需的 value 值,而不是使用默认值,从而才能使用该插件。
例如,以下代码使用了保存到文件中滚动分页插件
<script type="text/javascript" src="jquery.dataTables.js"></script>
<script type="text/javascript" src="dataTables.scrollingPagination.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#example').dataTable( {
"pagingType": "scrolling"
} );
} );
</script>
请注意,与其他 DataTables 插件不同,分页插件尚未作为 ES 或 CommonJS 模块提供。这将在未来得到纠正,并对 DataTables 2 的分页 API 进行改进。
插件
bootstrap_input | 插件提供与 `default` 分页类型相同的功能(参见 `pagingType` 选项),但带有供跳转页面的输入字段,供配合引导主题使用。 |
extjs | ExtJS 样式的分页 |
four_button | 显示向前、向后、第一个和最后一个按钮。 |
full_numbers_no_ellipses | 与“full_numbers”相同的分页,但没有省略号 |
input | 显示一个输入元素,用户可以在其中输入页码 |
scrolling | 记录滚动时将页面更改显示为表格的重新绘制。 |
select | 显示用户可从中选择的 `dt-tag select` 页面列表。 |
simple_incremental_bootstrap | 显示向前/向后按钮和所有已知页码。 |
simple_numbers_no_ellipses | 与“simple_numbers”相同的分页,但没有省略号 |