ie中layui分页不显示的根本原因是dom渲染、css计算与js执行协同失败,需显式配置page:true、确保count为数字且位于响应根级、避免overflow截断并手动重定位分页容器。

分页栏在 IE 中不显示,不是配置漏了,而是 IE 对 Layui 分页的 DOM 渲染、CSS 计算和 JS 执行三者协同失败导致的——尤其 IE10/11 下,display: flex、getBoundingClientRect()、overflow: auto 这几个点一碰就崩。
page: true 必须显式写,且不能依赖默认值
Layui 表格分页默认是关闭的,哪怕你写了 url 和 cols,只要没写 page: true 或等效对象,分页 DOM 根本不会生成。
-
page: true是最简写法,适用于前端静态数据分页;服务端分页必须写成page: { layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'] } - IE 下若只写
page: {}(空对象),Layui 会跳过分页初始化逻辑,渲染结果就是“什么都没有” - 别信文档里“默认为 false”的说明——它真就是 false,且 IE 不会帮你 fallback
count 字段必须在响应根级,且类型是 number
IE 对 JSON 解析更严格,parseData 返回的 count 若是字符串(如 "100")或 undefined,分页栏直接消失,连错误提示都不报。
- 用浏览器 Network 面板确认响应体,检查是否返回了
count: 100(注意不是"count": "100") - 如果后端返回结构是
{ result: { count: 100, data: [] } },必须配parseData:parseData: function(res) {<br> return {<br> count: res.result.count,<br> data: res.result.data<br> };<br>} - 千万别漏掉
count字段——Layui 用它算总页数,没有它,layout里写了'count'也白搭
IE 下分页容器被 overflow 截断,需手动重定位
IE11 对 position: absolute 的弹层定位计算异常,加上父容器 overflow: hidden 或 auto,会导致分页栏(.layui-laypage)被裁剪成只剩一条线,甚至完全不可见。
- 不要把表格放在
overflow: hidden的容器里(比如某些 tab 面板、layer 弹窗) - 若必须放,要在
done回调中手动把分页 DOM 移到body底下:layui.$('.layui-laypage').appendTo('body'); - 避免在
layer.open()后立刻调table.render(),改用success回调确保 DOM 已挂载完成
真正麻烦的不是“怎么让它出来”,而是 IE 下分页栏一旦渲染失败,后续所有 table.reload() 都可能继承这个残缺状态——所以首次渲染必须一次到位,DOM、数据、样式三者同步校验,缺一不可。











