onbeforeunload与onunload事件异同点总结


Posted in Javascript onJune 24, 2013

1)异同点
相同点:onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定。
不同点:
a)onbeforeunload在onunload之前执行 ,它还可以阻止onunload的执行。
b)onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;nunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用 。
c)onbeforeunload是可以阻止页面的更新和关闭的。但是onunload不能。
onload、onbeforeunload、onunload事件的执行顺序:
打开页面时:只执行onload
关闭页面时:先onbeforeunload,后onunload
刷新页面时:先onbeforeunload,后onunload,再onload

2)onbeforeunload、onunload事件
触发于:
a)关闭浏览器窗口
b)通过地址栏或收藏夹前往其他页面的时候
c)点击返回,前进,刷新,主页其中一个的时候
d)点击 一个前往其他页面的url连接的时候
e)调用以下任意一个事件的时候:click,document write,document open,document close,window close ,window navigate ,window NavigateAndFind,location replace,location reload,form submit.
f)当用window open打开一个页面,并把本页的window的名字传给要打开的页面的时候。
g)重新赋予location.href的值的时候。
h)通过input type=”submit”按钮提交一个具有指定action的表单的时候。
可以用在以下元素:
BODY, FRAMESET, window
浏览器支持:
IE4+/Win, Mozilla 1.7a+, Netscape 7.2+, Firefox0.9+

3)解决刷新页面时不调用onbeforeunload

4)onbeforeunload阻止页面的更新和关闭
onbeforeunload="return '是否现在离开此页面';">

Javascript 相关文章推荐
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
Apr 04 Javascript
精选的10款用于构建良好易用性网站的jQuery插件
Jan 23 Javascript
js作用域及作用域链概念理解及使用
Apr 15 Javascript
js 图片随机不定向浮动的实现代码
Jul 02 Javascript
关于js遍历表格的实例
Jul 10 Javascript
php跨域调用json的例子
Nov 13 Javascript
JavaScript中用getDate()方法返回指定日期的教程
Jun 09 Javascript
深入理解JavaScript 参数按值传递
May 24 Javascript
vue模仿网易云音乐的单页面应用
Apr 24 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
May 21 Javascript
微信小程序swiper左右扩展各显示一半代码实例
Dec 05 Javascript
JS三级联动代码格式实例详解
Dec 30 Javascript
控制页面按钮在后台执行期间不重复提交的JS方法
Jun 24 #Javascript
javascript动态添加样式(行内式/嵌入式/外链式等规则)
Jun 24 #Javascript
JS实现的省份级联实例代码
Jun 24 #Javascript
javascript中的绑定与解绑函数应用示例
Jun 24 #Javascript
用jquery生成二级菜单的实例代码
Jun 24 #Javascript
自动刷新网页,自动刷新当前页面,JS调用
Jun 24 #Javascript
jquery中的事件处理详细介绍
Jun 24 #Javascript
You might like
PHP 日期时间函数的高级应用技巧
2009/10/10 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
PHP json_encode() 函数详解及中文乱码问题
2015/11/05 PHP
php处理复杂xml数据示例
2016/07/11 PHP
PHP yii实现model添加默认值的方法(两种方法)
2016/11/10 PHP
thinkphp5 migrate数据库迁移工具
2018/02/20 PHP
js表数据排序 sort table data
2009/02/18 Javascript
基于jQuery实现的水平和垂直居中的div窗口
2011/08/08 Javascript
javascript简单性能问题及学习笔记
2014/02/04 Javascript
jQuery针对各类元素操作基础教程
2014/08/29 Javascript
JavaScript使用push方法添加一个元素到数组末尾用法实例
2015/04/06 Javascript
网页收藏夹显示ICO图标(代码少)
2015/08/04 Javascript
JS实现可编辑的后台管理菜单功能【附demo源码下载】
2016/09/13 Javascript
基于JS+Canves实现点击按钮水波纹效果
2016/09/15 Javascript
详解Node.js中exports和module.exports的区别
2017/04/19 Javascript
JS实现的input选择图片本地预览功能示例
2018/08/29 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
2018/10/23 Javascript
vue的注意规范之v-if 与 v-for 一起使用教程
2019/08/04 Javascript
nodejs dgram模块广播+组播的实现示例
2019/11/04 NodeJs
js实现一款简单踩白块小游戏(曾经很火)
2019/12/02 Javascript
从零使用TypeScript开发项目打包发布到npm
2020/02/14 Javascript
如何基于filter实现网站整体变灰功能
2020/04/17 Javascript
跟老齐学Python之类的细节
2014/10/13 Python
Python设计模式之工厂模式简单示例
2018/01/09 Python
Python OpenCV处理图像之图像直方图和反向投影
2018/07/10 Python
Django框架 信号调度原理解析
2019/09/04 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
PyCharm配置anaconda环境的步骤详解
2020/07/31 Python
python 利用Pyinstaller打包Web项目
2020/10/23 Python
英国亚马逊官方网站:Amazon.co.uk
2019/08/09 全球购物
法学专业个人求职信
2013/09/26 职场文书
五一家具促销方案
2014/01/10 职场文书
不听老师话的万能检讨书
2014/10/04 职场文书
向雷锋同志学习倡议书
2015/04/27 职场文书
七一慰问简报
2015/07/20 职场文书
解决Mysql的left join无效及使用的注意事项说明
2021/07/01 MySQL