项目背景
有时候在用户关闭浏览器的时候,希望给用户一些提示,提示确认了或者其他。有时候需要再关闭浏览器的时候清除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。