当页面中存在无限递归调用 alert() 的 JavaScript 代码时，浏览器会持续弹出模态对话框，阻塞主线程并阻止页面重载——即使点击刷新按钮，也仅关闭当前 alert 后立即触发下一个，形成死循环。根本解法是禁用原生 alert，改用非阻塞、可编程的现代弹窗库（如 SweetAlert2）。
当页面中存在无限递归调用 `alert()` 的 javascript 代码时，浏览器会持续弹出模态对话框，阻塞主线程并阻止页面重载——即使点击刷新按钮，也仅关闭当前 alert 后立即触发下一个，形成死循环。根本解法是禁用原生 `alert`，改用非阻塞、可编程的现代弹窗库（如 sweetalert2）。
该问题的本质在于：alert() 是同步阻塞式 API，它会暂停 JavaScript 执行、冻结 DOM 渲染，并接管浏览器焦点。在您的示例中：
<script type="text/javascript">
function alertLOL(){
alert("LOL"); // ❌ 阻塞执行，但函数仍会继续调用自身
alertLOL(); // → 下一轮递归立即触发
return;
}
alertLOL();
</script>这段代码一旦执行，就会陷入「弹窗 → 点击确定 → 再弹窗 → 再点击……」的不可中断循环，导致用户无法通过常规方式（F5 / Ctrl+R / 地址栏回车）刷新页面——因为每次刷新尝试都会被尚未退出的 JS 调用栈打断。
✅ 推荐解决方案：迁移到 SweetAlert2
SweetAlert2 是一个轻量、可定制、非阻塞的现代化弹窗库，基于 Promise 设计，完全不冻结主线程，支持异步交互与链式操作，且兼容所有现代浏览器。
1. 引入库（CDN 方式）
在 或页面底部添加：
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
2. 替换原生 alert() 示例
将递归警告逻辑改造为可控、可中断的异步流程：
function showLoginAlert() {
Swal.fire({
title: "登录提示",
text: "请输入账号密码以继续",
icon: "info",
confirmButtonText: "我知道了",
allowOutsideClick: false, // 可选：防止点击背景关闭
}).then((result) => {
if (result.isConfirmed) {
// ✅ 用户确认后，再执行下一步（如跳转、提交表单等）
// 注意：此处不再递归调用，避免死循环
console.log("用户已确认登录提示");
}
});
}
// 调用一次即可，无需递归
showLoginAlert();⚠️ 关键注意事项：
- 绝对避免在生产环境使用递归
alert()：它既破坏用户体验，又无法被调试工具有效中断，且违反 Web 标准的交互规范；- 禁用原生
alert（开发阶段可选）：可在调试时临时覆盖全局方法，防止误用：window.alert = (msg) => { console.warn("[Blocked] Native alert() disabled. Use Swal.fire() instead.", msg); };- 登录逻辑应解耦 UI 与业务：弹窗仅作提示，真正的登录请求应通过
fetch/axios+ 表单提交完成，配合加载状态与错误反馈，而非依赖弹窗控制流程。
通过采用 SweetAlert2，您不仅能彻底规避刷新失效问题，还能提升界面一致性、可访问性（支持键盘导航）和维护性。记住：现代 Web 应用中，alert()/confirm()/prompt() 已属于应被替代的遗留实践。
