关闭浏览器事件 onbeforeunload和onunload

  在做毕设的时候,需要在关闭浏览器的时候向后台服务器修改用户在线状态。首先讲一下 onbeforeunload 和 onunload(都是在刷新或关闭时调用) 的区别:

(1)onbeforeunload:在即将离开当前页面(刷新或关闭)时触发,即正要去服务器读取新的页面时调用,此时还没开始读取。该事件可用于弹出对话框,提示用户是继续浏览页面还是离开当前页面。兼容方面如下:

  • IE、Safari 完美支持
  • Firefox、Chrome 不支持文字提醒信息
  • Opera 不支持

(2)onunload:在用户退出页面时发生,即已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。该事件可用于当用户离开页面时发生的事件(通过点击一个连接,提交表单,关闭浏览器窗口等等。)。兼容方面如下:

  • IE浏览器 页面跳转刷新页面能执行,但关闭浏览器不能执行;
  • firefox 页面跳转能执行,但刷新页面、关闭浏览器不能执行;
  • Safari 刷新页面、页面跳转,关闭浏览器都会执行;
  • Opera、Chrome任何情况都不执行。

  综上所述,onunload是无法阻止页面的更新和关闭的,而 onbeforeunload 可以做到。但注意的是请求需要同步,我觉得应该是采用异步方法,那么浏览器会在方法成功发送并响应前先unload,从而导致请求丢失。如果采用的是同步方法,浏览器就会等待请求成功,然后再unload。

  因为我项目的接口请求是用axios统一封装代码,而且没找到方法让axios的请求方法变成同步,所以我用了jQuery的ajax请求方法,代码如下:

原文地址:https://www.cnblogs.com/threepigs/p/10767785.html

时间: 2024-10-03 18:59:04

关闭浏览器事件 onbeforeunload和onunload的相关文章

JS监听关闭浏览器事件

Onunload与Onbeforeunload Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行. Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读

js获取关闭浏览器事件

谷歌浏览器,火狐浏览器,360浏览器测试可行,IE7测试也是可行的 <span style="font-size:14px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Confirm Before Leave</title> <meta http-equiv=&q

监听关闭浏览器事件

主要是监听了window的onbeforeunload事件,对一般的浏览器来说如果在这个事件监听时返回一个字符串,它就会弹出一个对话框,但有的浏览器是使用event.returnValue,你可以使用以下的兼容性代码 window.onbeforeunload = function (e) { var message = 'some word'; e = e || window.event; if (e) { e.returnValue = message; } return message;

onbeforeunload与onunload事件

Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过 window.onunload来指定或者在<body>里指定.区别在于onbeforeunload在onunload之前执行,它还可 以阻止onunload的执行. Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读 取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页

各浏览器对 onbeforeunload 事件的支持与触发条件实现有差异

标准参考 无. 问题描述 一般情况下,onbeforeunload 事件处理函数内会写入一些提示性语句,当用户的浏览器跳转到其他页面时,用来提醒用户当前页面将要跳转,请用户决定是否观看新页面.或者在 onbeforeunload 事件内处理一些业务逻辑,在浏览器跳转到新页面之前 ,执行一些业务逻辑,如保存用户浏览信息等. 简单的说这个事件应仅在页面 URL 发生变化时触发,但是在 IE 中 使用 JavaScript 伪协议执行脚本程序时,也会触发 onbeforeunload 事件. 造成的影

js关闭浏览器窗口及检查浏览器关闭事件

js关闭浏览器窗口,不弹出提示框.支持ie6+,火狐,谷歌等浏览器,下面以一个示例为大家详细介绍下具体的实现方法,感兴趣的朋友可以参考下 js关闭浏览器窗口 js关闭浏览器窗口,不弹出提示框.支持ie6+,火狐,谷歌等浏览器. <html> <head /> <body> <script type="text/javascript"> function closeWin(){ window.opener=null; window.open

JS监听浏览器事件

Onunload与Onbeforeunload Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行. Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读

刷新或关闭时调用onbeforeunload

Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行.  Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时

兼容性强的js捕捉网页刷新关闭退出事件的方法

当我们离开一个网页时,往往需要提醒用户自己的这一行为,比如我正在编辑一个文档,或者我是在使用网上银行,我希望在自己操作失误之后能给我一次改正的机会.这里说道的离开一个网页,其实分为好几种情况:刷新 关闭 后退我们经常用到页面关闭事件onbeforeunload,可以给用户一个选择放弃关闭的机会,就比如这个博客编辑器.如果用户选择了离开,那么onunload事件自然会触发:但若用户选择了取消(或者是留在此页),又该如何检测呢? window.onbeforeunload = function()