[Javascript]onbeforeunload事件

本文介绍了如何使用window.onbeforeunload事件来实现当用户试图离开页面但有未保存更改时显示警告对话框的功能。同时提到了Mootools框架下的实现方式,并讨论了事件触发的条件。
同事说想要用户离开当前页面时执行一个事件,我能想到的就是window.onunload和window.onbeforeunload两个事件。比如原来关闭窗口时经常会遇到跳出个广告窗口就是这么做的。

而window.onbeforeunload是在关闭窗口前执行,因此,我们还可以利用它做点别的东西,前两天玩开心网的买房子组件,如果你在动了房子内的摆设而没有保存的就想要离开当前页的话,就会跳出个提示,只有点了确认才能离开当前页面,这就是一个很好的应用。

ExpandedBlockStart.gif ContractedBlock.gif window.onbeforeunload  =   function (e) {
    e 
= e || window.event;
    e.returnValue
="真的要走?";
}


如果打算使用Mootools的事件来完成,就要稍微变动一下,因为Mootools对浏览器的事件进行了包装,我们可以通过e.event来得到原来的事件,前面的这个e就是Mootools包装后的事件:
ExpandedBlockStart.gif ContractedBlock.gif window.addEvent( ' beforeunload ' , function (e) {
    e.event.returnValue
="真的要走?";
}
)


示例 

由于刷新,关闭,前进后退等行为都会触发window.onbeforeunload事件,因此无法直接通过onbeforeunload来区分用户的刷新和关闭行为,网上有代码说能实现,我看了下,只适应于IE6。因此,为了保险起见,不建议那么做。

转载于:https://www.cnblogs.com/noidea/archive/2008/12/17/1357059.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值