切勿使用 unload 事件

警告

切勿添加 unload 事件监听器！请改用 pagehide 事件。添加 unload 事件监听器会导致您的网站在 Firefox 中速度变慢，并且在大多数情况下，此代码在 Chrome 和 Safari 中甚至无法运行。

错误做法

这段代码将无条件地添加了 beforeunload 监听器。

window.addEventListener("beforeunload", (event) => {
  if (pageHasUnsavedChanges()) {
    event.preventDefault();
    return (event.returnValue = "Are you sure you want to exit?");
  }
});

正确做法

这段代码仅在需要时添加 beforeunload 监听器（在不需要时将其移除）。

function beforeUnloadListener(event) {
  event.preventDefault();
  return (event.returnValue = "Are you sure you want to exit?");
}

// A function that invokes a callback when the page has unsaved changes.
onPageHasUnsavedChanges(() => {
  window.addEventListener("beforeunload", beforeUnloadListener);
});

// A function that invokes a callback when the page's unsaved changes are resolved.
onAllChangesSaved(() => {
  window.removeEventListener("beforeunload", beforeUnloadListener);
});

错误做法

window.addEventListener('unload', ...);

正确做法

window.addEventListener('pagehide', ...);

点击查看官方解释