浏览器拦截非用户主动触发的弹窗是安全机制，核心因JS在无用户手势上下文（如click）时调用window.open()；必须保证手势链完整，异步回调会丢失上下文；推荐用DOM模态框替代，或预留空窗口再导航。
浏览器默认拦截非用户主动触发的 window.open() 和部分 showModalDialog()（已废弃）调用，这是安全机制，不是插件或代码写错了。
为什么弹窗总被拦截？
核心原因是：JS 在没有用户手势（如 click、touchstart）上下文中直接调用弹窗方法。比如在 setTimeout、fetch 回调、DOMContentLoaded 甚至 input 事件里调用 window.open()，现代浏览器（Chrome、Edge、Safari）一律视为可疑行为并静默拦截。
- 控制台通常会输出类似
Failed to open window: Blocked by browser policy的警告 - 某些 JS 插件（如
layer.open()、layui.layer.open()、$.fancybox()）底层仍依赖window.open()或创建新window实例，同样受制于此 - 即使插件封装了 DOM 弹层（如
div模态框），若它内部尝试打开新窗口（例如导出 PDF 时调用window.open('about:blank')），也会被拦
必须保证「用户手势链」完整
从用户点击开始，到弹窗调用，中间不能断开同步执行流。异步回调（Promise.then、async/await 后续）、定时器、事件委托二次触发，都会丢失手势上下文。
- ✅ 正确：
button.addEventListener('click', () => { layer.open({...}); }) - ❌ 错误：
button.addEventListener('click', () => { setTimeout(() => { layer.open({...}); }, 100); }) - ❌ 错误：
fetch('/api/data').then(() => layer.open({...))—— 即使是 click 触发的 fetch，回调也不再属于手势上下文 - ⚠️ 注意：
async函数本身不破坏手势，但await后的代码已脱离原始事件栈，需把弹窗逻辑放在await前或用其他方式保持同步
替代方案：用 DOM 模态框代替新窗口
绝大多数「弹窗」需求其实不需要真实窗口，改用页面内 div + position: fixed + z-index 实现更可靠，也完全规避拦截问题。
