最可靠的方式是调用laypage.render()传入含新curr的完整配置对象;配合table.render()时应优先用table.reload()设置page.curr;laypage.skip()适用于layui 2.8+的轻量跳页。

最可靠的方式是调用 laypage.render() 并传入含新 curr 的完整配置对象;若配合 table.render(),应优先用 table.reload() 设置 page.curr。
用 laypage.render() 重渲染跳页
layui 不允许直接修改分页实例的内部状态,curr 只在初始化或重渲染时生效。你不能写 laypage.curr = 5,这不会触发 UI 更新,也不会调用 jump 回调。
- 必须传入完整配置对象,至少保留
elem、count、limit、curr和jump—— 漏掉count会导致页码错乱,漏掉limit可能让总页数计算错误 - 如果原分页已存在,建议提前缓存原始配置(比如挂到 DOM 上或全局变量),避免硬编码重复参数
-
jump回调里务必加if (!first)判断,否则重渲染会触发两次数据加载(一次初始化、一次跳页) - 示例:
laypage.render({ elem: 'demo', count: 200, limit: 10, curr: 7, jump: function(obj, first) { if (!first) { loadData(obj.curr); } } });
用 table.reload() 跳表格分页
如果你用的是 table.render() 且启用了 page: true,不要操作底层 laypage 实例——表格组件自己管理分页状态,手动改 laypage 容易导致 UI 与数据不同步。
- 必须传表格的
id字符串(即render()时指定的id),否则reload找不到目标实例 -
page.curr必须是整数,传字符串如"3"会静默失败(无报错,但页码不动) - 服务端分页下,
curr会自动拼进请求参数(如?page=3&limit=10);前端分页(data数组)下,也要确保limit和总数据量匹配,否则页码可能被强制重置 - 示例:
table.reload('myTable', { page: { curr: 4 }, where: { status: 'active' } });
用 laypage.skip() 快速跳页(Layui 2.8+)
这是比重渲染更轻量的选择,不重建 DOM,只更新当前页码显示并触发 jump 回调,适合按钮点击等高频场景。
- 第一个参数是容器
elem(id 字符串或 DOM 对象),第二个是目标页码(整数) - 它不校验
count或limit,所以调用前请确保这些值仍是有效的,否则页码可能超出范围却不提示 - 适用于「首页」「末页」这类固定跳转,不适合动态计算页码的逻辑(比如搜索后跳第一页,仍建议走
table.reload()) - 示例:
laypage.skip('demo', 1); // 跳首页
别碰 DOM 模拟点击(仅应急)
通过 $(".layui-laypage-skip input").val(5).closest(".layui-laypage-btn").click() 这类方式绕过 API,属于 hack 行为。
- 依赖 layui 内部 class 名和 DOM 结构,Layui 小版本升级就可能失效
- 跳页框可能被隐藏(比如 layout 里没配
'skip'),或输入框被禁用,导致脚本静默失败 - 仅在无法访问原始配置、又不能 reload 表格的极端封装场景下临时使用,上线前务必替换为正规方案
真正容易被忽略的是:所有跳页动作都依赖当前配置的 count 值是否准确。如果数据总数变了(比如搜索后总数从 100 变成 12),但你还拿旧的 count 去 render(),页码栏可能显示“共 12 页”,实际只渲染了 10 页的数据——这种错位不会报错,但用户点到最后一页会空白。











