必须将 filter: blur() 应用于唯一静态根容器（如 #app），配合计数器管理多层弹窗的模糊状态，并为 IE/旧 Edge 降级 opacity 遮罩，同时注意 iOS Safari 兼容性问题。
直接给 body 或 html 加 filter: blur() 没用——layui 的遮罩层（.layui-layer-shade）和弹层（.layui-layer）是独立插入到 body 末尾的兄弟节点，不包裹页面内容，所以模糊不会作用到你真正想模糊的业务区域。
必须作用于稳定根容器（如 #app）
模糊生效的前提是：滤镜加在「包裹全部页面内容」的容器上，且该容器不能被 Layui 动态移除或替换。常见错误是直接操作 body，结果发现 .layui-fixbar、.layui-laydate 等浮动组件脱离文档流，漏出清晰区域。
- 确认你有唯一、静态的外层容器，比如
<div id="app"></div>，所有业务代码都嵌套其中 - 不要用
document.body或document.documentElement作为目标——它们不是视觉上的“背后内容” - 样式中必须加
transition: filter 0.2s ease，否则开启/关闭时会突兀闪动
layer.open 打开前加类，关闭后移除（需计数器防多层冲突）
用户快速连点打开多个弹窗时，如果只靠开关单个 class，关闭第一个就会清掉 blur-bg，导致第二个弹窗背景突然变清晰——这不是 bug，是状态没管理。
- 定义全局计数器：
window.layerBlurCount = 0 - 每次调用
layer.open前执行：window.layerBlurCount++，然后document.getElementById('app').classList.add('blur-bg') - 在
success或end回调里（不是cancel）做减法：window.layerBlurCount--，仅当window.layerBlurCount === 0时才remove('blur-bg') - 别依赖
layer.close(index)后立刻移除——用户可能按 Esc、点遮罩、或直接刷新，回调未必触发
IE / Edge ≤17 必须降级为 opacity 遮罩
filter: blur() 在 IE 全系和旧 Edge 中被完全忽略，强行写入不仅无效，还可能因 CSS cascade 导致布局塌陷或滚动条错位。
- 检测支持性优先用：
CSS.supports('filter', 'blur(1px)')（现代浏览器） - 兼容兜底可 UA 判断：
navigator.userAgent.indexOf('MSIE') > -1 || navigator.userAgent.indexOf('Trident') > -1 - 不支持时，改用提升
.layui-layer-shade的opacity（例如0.85），同时确保主容器不加任何 filter - 切记：iOS Safari 下同时启用
filter和高opacity遮罩，可能触发白屏或闪烁
最易被忽略的是多层弹窗状态同步——哪怕只用一次 layer.open，只要页面存在其他插件（比如日期选择器、下拉菜单）也调用了 layer，计数器就可能失准。上线前务必模拟连续打开/关闭 + 刷新 + Esc 关闭的混合操作。
