页面 - 刷新、离开相关事件

beforeunload

• 当浏览器窗口关闭或者刷新时，会触发beforeunload事件。当前页面不会直接关闭，可以点击确定按钮关闭或刷新，也可以取消关闭或刷新。
• 能够触发请求（谷歌）
• 如果处理函数为Event对象的returnValue属性赋值非空字符串，浏览器会弹出一个对话框，来询问用户是否确定要离开当前页面（如下示例）。没有赋值时，该事件不做任何响应。
  • 有些浏览器会将返回的字符串展示在弹框里，但有些其他浏览器只展示它们自定义的信息。

// 多内核代码
window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "\o/";

  (e || window.event).returnValue = confirmationMessage;     // Gecko and Trident
  return confirmationMessage;                                // Gecko and WebKit
});

• 在此事件处理函数中，对于window.alert(), window.confirm(), 和 window.prompt() 的调用会被忽略。
• 许多手机浏览器会忽略该事件处理的返回值（亦即，它们不会要求用户确认，而是直接执行操作）

unload

• 当文档或一个子资源正在被卸载时, 触发 unload事件。
• 在下面两个事件后被触发:
  • beforeunload (可取消默认行为的事件)
  • pagehide
• 文档会处于一个特定状态：
  • 所有资源仍存在 (图片, iframe 等.)
  • 对于终端用户所有资源均不可见
  • 界面交互无效 (window.open, alert, confirm 等.)
  • 错误不会停止卸载文档的过程
• 遵循文档树:父iframe会在子iframe卸载前卸载
• 事件e包含以下属性
  • target：事件目标（DOM树中最顶层的目标），谷歌中是document节点
  • type:"unload"
  • bubbles:false // 是否正常冒泡
  • cancelable:false // 是否可以取消
• 关闭浏览器时能触发事件。但是请求无法发起，后端无法拦截到（不是很确定），能够console.log（谷歌）
• 刷新不会触发（谷歌）
• 同域跳转页面会被触发，跨域不会（谷歌）

pagehide

• 当浏览器在会话历史记录中的不同页面切换过程中隐藏当前页面时，将向窗口发送pagehide事件。例如，当用户单击浏览器的“后退”按钮时，当前页面在显示上一页之前会收到一个pagehide事件。
• 谷歌支持该事件

转载于:https://www.cnblogs.com/qq3279338858/p/10694671.html