有时候防止用户在使用过程中误操作关闭浏览器导致数据丢失,需要在关闭浏览器时弹窗提醒。因此浏览器提供了 onbeforeunload 事件(参考MDN BeforeUnloadEvent)
//MDN一个基本跨浏览器运行的例子
window.addEventListener("beforeunload", function (e) {
var confirmationMessage = "您还有未保存的数据,确定要离开吗?"; //虽然可能没啥用
(e || window.event).returnValue = confirmationMessage; //Gecko + IE
return confirmationMessage; //Webkit, Safari, Chrome etc.
});
Chrome及Firefox无法修改提示文字,大概是防止开发者滥用吧……
然而有时候我们会发现,在Chrome或Firefox中连续刷新不起作用,或者点击关闭按钮没有弹窗提醒,感觉总是时灵时不灵。但是如果在事件方法体内执行console控制台又有输出。
其实是因为要触发浏览器自带的关闭弹窗,用户必须跟网页有过交互。简单的来说就是点击过网页。
连续刷新时,因为你没有点击过网页内部,所以无法触发。
刚一打开页面就点击关闭时,同理也无法触发。
但是因为我比较懒,只测试了Chrome及Firefox,其他浏览器的表现无法提供确切数据,敬请见谅。