关于onbeforeunload的一些想法

页面在关闭前会有onbeforeUnload事件,来询问用户是否要关闭这个页面OR选项卡

浏览器的F5刷新为按下F5----onbeforeUnload----onunload----onload;

浏览器关闭为  onbeforeUnload----onunload;

在window.onbeforeunload的方法体中用alert或则confirm这样的方法在IE中是有效的,会弹出来,点击后页面也会关闭。confirm也是如此,即使你confirm点击了取消还是会刷新/关闭页面。并且在W3C浏览器,chrome,firefox中是不会弹出来的,但是会执行.是浏览器的一个bug或则机制吧,在页面关闭后alert和confirm等弹出框是不会弹出来的。想要一个可以让用户选择的是否关闭的办法,alert和confirm是不可行的

网上查了下资料发现用event.returnValue='你想让用户看到的信息';这样的方法可以在页面被关闭逼前让用户看到提示信息“这个页面要被关闭了,你想关闭还是不关闭?”来让用户进行选择

IE8,CHROME可以让用户完全看到你rerturnValue中的信息,firefox的内容就是浏览器自带的,不管你returnValue设置的显示内容是如何,他始终显示自带的

随后我在测试中发现直接使用return “你想让用户看到的信息”;这样的方式也能和上面使用event.returnValue产生同样的效果。

为什么使用return和event.renturnValue会产生同样的效果,分析,想了想。

一:可能这方法接受return的值,这个参数的值就会直接出现在提示信息中。

二:这个方法的event中的returnValue可以接受一个字符串让其显示在提示信息中。

但是其他的标签,比如A,button中returnValue就只有true和false 两种

假如我们有一个A标签,添加一个onclick事件,我们在return "123" 后面添加alert(“a”);这个A标签点击后是会执行任何默认的方法,即跳转等等。

当我们用return false后任何默认的行为都会不会被执行,后面的代码也不会执行(alert);

当我们用event.returnValue=false(IE或则W3C)或则event.preeventDefault()《W3C》后页面的默认行为如跳转等不会执行,但是下面的alert会执行。

event.returnValue的值只要是false就可以,也就是说event.returnValue=“”这样也可以的。event.returnValue=“haha”这样就是true了。

为什么呢?

returnValue和preeventDefault是阻止事件的默认行为就这个A标签来说,A标签点击的默认行为是跳转。但是其方法体就是onclick的方法中的代码还是会执行完。

而retrun false这样是完完全全阻止了事件的默认行为并且return后面的代码都不会执行。。。

两种方法怎么用,我觉得要分场合。比如就想单纯的阻止事件的默认行为的话就用preeventDefault这种,在方法里面执行代码,走流程并且还要阻止事件的默认行为的话用return false比较好

回到上面的关于onbeforeUnload使用return和returnValue的问题

由于return是直接返回,不执行下面的代码,所以我比较喜欢用returnValue这种方式。。

 

posted @ 2014-03-28 10:03  winenr123  阅读(1520)  评论(0编辑  收藏  举报