-
2021-06-14 02:03:30
项目背景
有时候在用户关闭浏览器的时候，希望给用户一些提示，提示确认了或者其他。有时候需要再关闭浏览器的时候清除cookie进行其他操作等等，需要用到浏览器关闭事件。
关于浏览器关闭事件的相关描述
有些朋友想在浏览器关闭的时候，弹出alert 、confirm或者prompt等。实验证明，这种做法是失败的，原因是浏览器关闭事件自动屏蔽执行js的某些方法，从而防止恶意攻击或者无法关闭浏览器的现象，针对这些事件的处理，一般都是写在浏览器底层。因此，你想在关闭浏览器的时候弹出alert提示框是不可能的。要是你对浏览器感兴趣，您可以去研究这些问题，同时也可以自己写一个简单的浏览器(ps网上应该有相关的方法，据说不是很难)。对于浏览器底层的东西，恕我才疏学浅，不是很了解！
浏览器关闭事件
真正地用js捕捉浏览器关闭事件，写法如下：
window.onbeforeunload = function(){
return '您确定要离开haorooms博客吗？';
};
会弹出“您确定要离开haorooms博客吗”这样的确认框，你可以点击留在此页或者确定离开来进行操作，要是你想简单的对用户进行提示，这句话已经能够达到效果了！
引深
假如你有项目需求，在关闭浏览器的时候，执行某项命令或者函数，你可以写在
window.onbeforeunload = function(){
};
这个函数里面，例如,我举一个关闭浏览器删除某一个cookie的例子。
window.onbeforeunload = function(){
Deletecookie ("输入你要删除cookie的名字")
};
function Deletecookie (name) { //删除名称为name的Cookie
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); //设置cookie过期
}
这个例子我没有真正地验证，但是我在onbeforeunload 中写了一个return，并console.dir一个数，看到这个console执行了，那应该删除cookie也是可以的了。
迟来的解释
看完了上面的例子，我再来解释一下onbeforeunload 和onunload事件，一般来说，解释都是放在开头的，但是我在这里放解释，是为了让你更深入的了解，巩固！
onbeforeunload与onunload事件,onunload和onbeforeunload都是在刷新或关闭时调用，可以在< script>脚本中通过window.onunload来指定或者在< body>里指定。区别在于onbeforeunload在onunload之前执行，它还可以阻止onunload的执行。
Onbeforeunload也是在页面刷新或关闭时调用，Onbeforeunload是正要去服务器读取新的页面时调用，此时还没开始读取；而onunload则已经从服务器上读到了需要加载的新的页面，在即将替换掉当前页面时调用。Onunload是无法阻止页面的更新和关闭的。而 Onbeforeunload 可以做到。
页面加载时只执行onload
页面关闭时先执行onbeforeunload，最后onunload
页面刷新时先执行onbeforeunload，然后onunload，最后onload。
更多相关内容 -
js关闭浏览器窗口及检查浏览器关闭事件
2021-01-19 18:43:27js关闭浏览器窗口 js关闭浏览器窗口，不弹出提示框。支持ie6+，火狐，谷歌等浏览器。 代码如下: <html> <head /> <body> [removed] function closeWin(){ window.opener=null; window.open(”,’_... -
js无提示关闭浏览器窗口的两种方法分析
2020-11-28 03:07:49用多种方式打开一个页面，然后用 window.close() 关闭它，在各浏览器下表现有所不同。如在地址栏中直接输入URL 时，Firefox Chrome Safari 下调用 window.close() 关闭页面无效。再如 Ctrl + 点击链接打开的窗口，... -
监控用户是否关闭浏览器的js代码
2020-10-29 18:49:28BS系统一个非常烦人的地方是不知道用户什么时候关闭浏览器离开系统.这里,我们采用onbeforeunload参数监控用户是否关闭浏览器. -
python UI自动化自动关闭浏览器学习记录
2021-01-20 02:57:18python UI自动化自动关闭浏览器学习记录 小白python自动化的第一天 之前都是看别人的文章 没想过自己也有记录学习的一天 不过成长嘛 总要有第一次 某天利用公司网站写自动化demo的时候 简简单单的写完 进主页找到... -
js 无提示关闭浏览器页面的代码
2020-10-29 07:40:37js 无提示关闭浏览器页面的代码与函数需要的朋友可以参考下。 -
PHP计划任务之关闭浏览器后仍然继续执行的函数
2020-12-18 03:09:44备忘一下这个函数: 函数名称：ignore_user_abort 本函数配置或取得使用端连接中断后，PHP 程序是否仍继续执行。默认值为中断连接后就停止执行。... //即使Client断开(如关掉浏览器),PHP脚本也可以继 -
javaScript 关闭浏览器 (不弹出提示框)
2020-10-29 10:07:00如果网页不是通过脚本程序打开的（window.open()），调用window.close()脚本关闭窗口前，必须先将window.opener对象置为null，否则浏览器（IE7、IE8）会弹出一个确定关闭的对话框。 -
window.close(); 关闭浏览器窗口js代码的总结介绍
2020-11-26 21:36:59关闭浏览器窗口js代码的总结介绍 序号 关闭代码 需要确认 无任何作用 无需确认 测试 1 window.close() IE7 firefox,chrome, safari Opera Close 2 window.opener=null; window.open(”,’_self’); window.... -
selenium框架中driver.close()和driver.quit()关闭浏览器
2021-01-21 15:19:02Windows系统上，每次运行完...webdriver中关浏览器关闭有两个方法，一个叫quit，一个叫close。 /** * Close the current window, quitting the browser if it's the last window currently open. */ void close(); /* -
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
2020-10-16 01:10:03今天小编就为大家分享一篇vue 关闭浏览器窗口的时候,清空localStorage的数据示例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧 -
关闭浏览器时提示onbeforeunload事件
2020-09-04 19:24:18主要介绍了关闭浏览器时提示onbeforeunload事件，有需要的朋友可以参考一下 -
js检查是否关闭浏览器的方法
2021-01-19 15:47:14本文实例讲述了js检查是否关闭浏览器的方法。分享给大家供大家参考，具体如下： //关闭浏览器提示信息 [removed] = function (e) { e = e || window.event; var y = e.clientY; if (y <= 0//点击浏览器或者... -
PHP检测用户是否关闭浏览器的方法
2020-12-18 14:41:29本文实例讲述了PHP检测用户是否关闭浏览器的方法。分享给大家供大家参考，具体如下： 1、例子1 echo str_repeat(" ",3000); ignore_user_abort(true); mylog('online'); while (true) { /* * 1、程序正常结束 ... -
JS监控关闭浏览器操作的实例详解
2020-12-12 08:48:50JS监控关闭浏览器操作的实例详解 需求如下： 用户关闭浏览器通知后台。 方案如下： 1.采用js监控关闭浏览器操作。 2.用户关闭浏览器的时候发ajax请求到后台，执行相应的业务操作 代码如下： <!DOCTYPE... -
vue关闭浏览器退出登录
2021-11-30 21:41:42根据`beforeunload`和`unload`这两个事件实现关闭浏览器退出登录。展开全文项目需要：也在网上找了不少类似的文章，不过用起来多少有点问题，毕竟要适合自己的需求，我这里是vue3适用，理论上vue2也可以使用，我写的方法是通用的。
这些方法无非都是根据
beforeunload和unload这两个事件执行的。
下面我搜了下菜鸟教程和MDN对两个事件的介绍，可自行琢磨。1、beforeunload事件
1.1、菜鸟教程：
1.2、MDN
2、unload事件
2.1、菜鸟教程
2.2、MDN
MDN：通常而言，我们推荐使用 window.addEventListener() 来监听 unload (en-US) 事件，而不是直接给 onunload 赋值。下面贴我使用的源码;
3、源码部分
3.1、方法一：可写于html页面使用（直接使用）
var _beforeUnload_time = 0, _gap_time = 0; window.onunload = function (){ _gap_time = new Date().getTime() - _beforeUnload_time; if(_gap_time <= 10) {//浏览器关闭 window.mgr.signoutRedirect();//这个mgr是我暴露在window的退出登录方法 }else{//浏览器刷新-chrome刷新 console.log(document.domain); return confirm("确定要离开本系统么？"); } }; window.onbeforeunload = function (){ _beforeUnload_time = new Date().getTime(); };3.2、方法二：可写于组件如
app.vue使用（监听事件）data() { return { gap_time: 0, beforeUnload_time: 0, }; }, methods: { // 关闭窗口之前执行 beforeunloadHandler() { this.beforeUnload_time = new Date().getTime(); }, unloadHandler() { this.gap_time = new Date().getTime() - this.beforeUnload_time; //判断是窗口关闭还是刷新 毫秒数判断 网上大部分写的是5 if (this.gap_time <= 10) { mgr.signoutRedirect(); // 退出登录接口 这里应当换为个人的登出方法 } else { console.log(document.domain); return confirm("确定要离开本系统么？"); } }, }, unmounted() {//vue可换为destroyed()生命周期，不过这个也可以用 // 移除监听 window.removeEventListener("beforeunload", () => this.beforeunloadHandler()); window.removeEventListener("unload", () => this.unloadHandler()); }, mounted() { // 监听浏览器关闭 window.addEventListener("beforeunload", () => this.beforeunloadHandler()); window.addEventListener("unload", () => this.unloadHandler()); },
-
探讨:关闭浏览器后,php脚本会不会继续运行
2020-09-05 05:28:10本篇文章是对关闭浏览器后,php脚本会不会继续运行进行了详细的分析介绍，需要的朋友参考下 -
浏览器关闭时清空localStorage储存的数据
2021-01-08 12:48:24浏览器关闭时清空localStorage储存的数据说明需求解决方案及思路 说明 由于不同页面或标签页间无法共享sessionStorage的信息，所以将项目中登录状态存于localStorage中。 需求 需要在用户关闭浏览器时，将... -
js关闭浏览器页面方法
2019-11-19 17:04:30方法一: 再打开页面的是时候, 用新标签打开并给页面命名, 然后通过命名控制关闭 <!DOCTYPE html> <html lang="en">...打开关闭浏览器</title></head> <body> <butto...展开全文方法一:
- 再打开页面的是时候, 用新标签打开并给页面命名, 然后通过命名控制关闭
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>打开关闭浏览器</title></head> <body> <button class="open">打开</button> <button class="close">关闭</button> </body> <script> let open = document.querySelector('.open') let colse = document.querySelector('.close') var win open.onclick = function() { win = window.open('https://blog.csdn.net/weixin_45289067/article/details/93870494','','width=500,height=300') } colse.onclick = function() { if(win){ win.close() } } </script> </html>方法二:
- 关闭当前的标签页面
// 兼容所有浏览器关闭页面方法 function ClosePage() { if (navigator.userAgent.indexOf("MSIE") > 0) { if (navigator.userAgent.indexOf("MSIE 6.0") > 0) { window.opener = null; window.close(); } else { window.open('', '_top'); window.top.close(); } } else if (navigator.userAgent.indexOf("Firefox") > 0) { window.location.href = 'about:blank '; //火狐默认状态非window.open的页面window.close是无效的 //window.history.go(-2); } else { window.opener = null; window.open('', '_self', ''); window.close(); } } // 调用既可以关闭 setTimeout(function(){ ClosePage() }, 2000)
-
网站关闭浏览器页签不需要重新登录关闭整个浏览器需要重新登录
2021-09-04 15:26:39第 1 步：当登录进入网站时记录状态位loginStatus到cookie中，注意不要设置expires，这样cookie在会话期间有效，当关闭全部浏览器的时候会清除cookie。 setCookie('loginStatus', true); 第 2 步 ：再次打开...展开全文使用cookie来实现
第 1 步：当登录进入网站时记录状态位loginStatus到cookie中，注意不要设置expires，这样cookie在会话期间有效，当关闭全部浏览器的时候会清除cookie。
setCookie('loginStatus', true);第 2 步 ：再次打开浏览器进入页面，获取cookie中的loginStatus，此时已经获取不到了，在此处下线登录状态，就需要用户重新登录了。
// 此处代码要写在项目 这样一进来网站就会被访问到 if (!getCookies('loginState')) { // 退出登录状态 logout(); }存取cookie可使用自己封装的方法
-
js关闭浏览器
2019-04-09 11:00:00旧版本浏览器有些支持window.close()方法，目前主流浏览器都不支持，就算让你测试到一款浏览器能关闭，做前端的，其他浏览器无法适配就搞死了。 https://stackoverflow.com/questions/2593... -
关闭浏览器缓存
2019-06-26 17:11:31打开浏览器，按F12打开调试窗口选择Network选项栏，然后勾选Disable cache 。 -
关闭浏览器窗口弹出提示框并且可以控制其失效
2020-09-04 12:23:22主要介绍了关闭浏览器窗口时弹出提示框，并且可以通过函数控制其失效,需要的朋友可以参考下 -
JS区分浏览器页面是刷新还是关闭
2020-11-26 03:02:54Web开发者在系统开发中经常要面对产品经理各式各样的需求，当然，大部分对产品体验还是有帮助的，例如我们今天提到的刷新页面，前进后退，关闭浏览器标签时，为了避免用户误操作，需给出二次确认提示框，这个相信... -
vue中关闭浏览器清除localStorage
2020-11-30 17:11:14关闭浏览器清除信息，并且刷新时保持状态不受影响 mounted() { window.onload = function () { console.log(window.sessionStorage["ISlogin"]); if (!window.sessionStorage["ISlogin"]) { // 关闭浏览器 ...
