如何在JS中自定义window.onbeforeunload实现页面关闭时的自定义提示

基本实现方法 #

你可以通过监听window.onbeforeunload事件来触发离开提示。需要注意：现代主流浏览器（Chrome、Firefox、Edge等）会忽略自定义的提示文本，仅显示浏览器自带的标准化提示，但你仍需返回一个非空字符串来触发提示弹窗。

示例代码如下：

window.onbeforeunload = function(event) {
  // 自定义文本在现代浏览器中不会显示，但必须返回非空值以触发提示
  const customMessage = "感谢您的访问，确定要离开吗？";
  event.returnValue = customMessage;
  return customMessage;
};

关键注意事项 #

• 同步执行要求：事件处理函数必须是同步的，不能包含异步操作（比如fetch、setTimeout），否则浏览器不会触发提示。
• 触发场景：该事件会在用户关闭标签页、刷新页面、点击链接跳转到其他网站时触发。
• 浏览器限制说明：出于安全和用户体验考量，大部分浏览器不再支持完全自定义提示内容，仅展示浏览器预设提示，部分旧版浏览器可能会附带你返回的文本。
• 取消提示的方法：如果需要在特定场景下取消提示（比如用户完成表单提交后），可以将事件处理函数设为null：

  window.onbeforeunload = null;
  

内容的提问来源于stack exchange，提问作者Jissan Kharadi