必须在 layui.open 的 success 回调中动态插入 loading，因 DOM 此时已挂载；禁用 layer.load() 叠加，避免遮罩错位、关闭不同步及移动端兼容问题；异步加载需手动发请求并确保 .always() 清理 loading；移动端需设 pointer-events: none 并保证父容器 position: relative。
layui.open 里怎么加 loading 遮罩
直接在 layui.open 的 content 里塞 loading 不行，因为弹出层还没渲染完，dom 还没挂载，document.getelementbyid 找不到目标节点。得靠 success 回调——它在弹窗 dom 插入页面后、动画开始前触发，是唯一能安全操作内容区域的时机。
常见错误是把 loading 放在 content 字符串里硬写死，结果弹出层一闪而过，loading 根本没显示；或者用 setTimeout 延迟操作，但时间不好控，快网下可能还没加载就隐藏了。
- 用
success回调获取弹窗 body 节点：$(this).find('.layui-layer-content')或原生this.querySelector('.layui-layer-content') - 在回调里动态插入 loading HTML，比如
<div class="layui-layer-loading"></div>（Layui 自带样式） - 加载完成后再用
layer.closeLoading()或手动移除 loading 元素
为什么不能用 layer.load() 叠在 open 上面
layer.load() 是独立浮层，z-index 默认比 layer.open() 低，而且它不绑定到目标弹窗上。两个浮层叠加时，常出现遮罩错位、关闭不同步、点击穿透等问题——尤其当 open 弹窗带 shadeClose: true，点遮罩会关掉 load 却关不掉 open，留下空白弹窗。
更麻烦的是兼容性：Layui 2.8+ 对 layer.load() 的 z-index 做了调整，老项目升级后容易突然失效；移动端 Safari 下还可能出现遮罩层不响应 touch 事件。
- 不要并行调
layer.load()和layer.open() - 如果必须复用 loading 效果，优先改用
layer.msg('加载中...', {icon: 16, time: 0})并手动控制关闭，但注意它不遮罩 - 真正需要遮罩时，只在 open 内部做 DOM 层级控制
异步加载 content 后怎么替换 loading
当 content 是 URL（比如 content: ['xxx.html', 'get']），Layui 会自动发起请求，但不会等返回再显示弹窗——它先渲染空弹窗，再填内容。这时候 success 回调拿到的是空容器，loading 必须放进去，等 AJAX 完成再删。
关键点在于：Layui 没暴露内部请求状态，不能监听“加载完成”，只能自己接管请求。否则会出现 loading 消失太早（内容还没渲染）或卡死（忘了清除）。
- 把
content改成函数形式：content: function() { return '<div class="loading">...</div>'; } - 在
success回调里手动发 AJAX，用$.get()或fetch，成功后用$(layero).find('.layui-layer-content').html(data)替换 - 务必在 AJAX
.always()或finally里清理 loading，避免异常时残留
移动端点击遮罩不关闭弹窗？检查 z-index 和 pointer-events
有些机型（特别是 iOS 微信内置浏览器）下，loading 遮罩盖住整个弹窗内容区后，点外面的半透明 shade 区域没反应。这不是 Layui bug，而是因为 loading 元素用了 position: absolute 且未设 pointer-events: none，挡住了底层 shade 的点击穿透。
另一个坑是自定义 loading 用了 height: 100% 但父容器没设 position: relative，导致遮罩高度塌陷，实际没盖住全屏。
- 给 loading 元素加
style="pointer-events: none;"，确保 shade 可点击 - 确认 loading 父容器（即 .layui-layer-content）有
position: relative - 避免用
vh单位设 loading 高度，iOS Safari 对弹窗内 vh 计算不准，改用100%或 JS 动态赋值
