You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在初始化后设置jQuery DataTables的分页属性?附示例代码

修改DataTables初始化后的分页相关属性

嘿,我来帮你搞定这个问题!既然你已经初始化了teacherstable这个DataTables实例,咱们可以直接用它的API来调整分页相关的属性,下面是几个常用场景的具体操作:

1. 修改每页显示的记录条数(pageLength)

如果你想把原来的每页10条改成其他数量,直接调用page.len()方法就行,记得最后要调用draw()让表格重新渲染生效:

// 设置每页显示20条记录
this.teacherstable.page.len(20).draw();

2. 开启/关闭用户调整每页条数的功能(lengthChange)

你初始化时设置了"bLengthChange": false(对应DataTables 1.10+的lengthChange选项),如果之后想开启这个功能,可以用settings().set()来修改:

// 开启用户调整每页条数的功能
this.teacherstable.settings().set('lengthChange', true).draw();

// 如果要重新关闭,把true改成false即可
this.teacherstable.settings().set('lengthChange', false).draw();

3. 修改分页控件的样式类型(pagingType)

DataTables支持多种分页样式,比如默认的simple、带页码的simple_numbers、完整的full_numbers等。如果要切换分页类型:

// 改成完整带页码的分页样式
this.teacherstable.settings().set('pagingType', 'full_numbers').draw();

常见的pagingType可选值还有:simple、full、numbers等,你可以根据需求选择。

4. 显示/隐藏整个分页控件

如果临时想隐藏分页栏,或者重新显示它:

// 隐藏分页控件
this.teacherstable.settings().set('paging', false).draw();

// 重新显示分页控件
this.teacherstable.settings().set('paging', true).draw();

注意事项

所有修改设置的操作后,一定要调用draw()方法,这样DataTables才会重新渲染表格,让新的设置生效。另外,这些API在DataTables 1.10及以上版本都能正常使用,如果你用的是旧版本,可能需要调整为对应的旧API(比如oSettings相关的操作),不过现在一般都是用1.10+的版本啦。

内容的提问来源于stack exchange,提问作者roopteja

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.22 08:54:48