onbeforeunload与onunload事件异同点总结
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 '是否现在离开此页面';">
相关推荐
-
用js判断页面刷新或关闭的方法(onbeforeunload与onunload事件)
Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行. Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调
-
javascript Onunload与Onbeforeunload使用小结
Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取:而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用.Onunload是无法阻止页面的更新和关闭的.而Onbeforeunload 可以做到.曾经做一个考试系统,涉及到防止用户半途退出考试(有意或者无意),代码如下: 复制代码 代码如下: <body onbeforeunload=" checkLeave()"&
-
浅谈javascript中onbeforeunload与onunload事件
在最近的项目中,需要做到一个时间,就是用户离开页面的时候,我需要缓存页面其中一部分的内容,但是我不需要用户刷新的时候也缓存,我只希望在我用户离开的时候 执行这个函数.百度之,有onbeforeunload与onunload这两个事件,但是onbeforeunload在用户刷新的时候也会执行.搞得我弄的挺久的,所以想在这里做一个小小的总结 onbeforeunload与onunload事件 onbeforeunload定义和用法 onbeforeunload 事件在即将离开当前页面(刷新或关闭)时
-
onbeforeunload与onunload事件异同点总结
1)异同点 相同点:onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定. 不同点: a)onbeforeunload在onunload之前执行 ,它还可以阻止onunload的执行. b)onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;nunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用 . c)onbefor
-
关于捕获用户何时点击window.onbeforeunload的取消事件
Detecting When The User Has Clicked Cancel One of the things you may want to do is to be notified when the user clicks cancel, aborting a page unload. Unfortunately there's no way to be immediately notified. The best you can do is to set a unique glo
-
JavaScript仿淘宝页面图片滚动加载及刷新回顶部的方法解析
淘宝图片处理讨论 淘宝网页面很大,但是打开速度很快.其对图片处理是运用了滚动加载,就是滚动轴滚到哪里,图片在哪里加载.但是你想查看他的源代码,那要费九牛二虎之力吧,因为他们代码压缩合并做的很好!因为图片是滚动加载的,初始化的时候图片不加载,那么当你在页面底部刷新页面的时候,底部的页面通常不会加载出来,淘宝网的做法貌似是(因为我没有看他们的源代码,只是凭操作),刷新让页面回到顶部. 模仿淘宝,做滚动图片加载 这里想到了三种方法: 1.javascript懒加载之可视区域加载 <!DOCTYPE h
-
JavaScript 捕获窗口关闭事件
1.用javascript重新定义 window.onbeforeunload() 事件 在javascript里定义一个函数即可 function window.onbeforeunload() { alert("关闭窗口")} alert()事件将会在关闭窗口前执行,你也可以用户决定是否关闭窗口 function window.onbeforeunload() { if (event.clientX>document.body.clientWidth && e
-
分享JavaScript获取网页关闭与取消关闭的事件
在做Web开发时,我们经常用到页面关闭事件onbeforeunload,可以给用户一个选择放弃关闭的机会,就比如这个博客编辑器.如果用户选择了离开,那么onunload事件自然会触发:但若用户选择了取消,又该如何检测呢? 我们假定一个页面离开取消事件,叫做onunloadcancel.显然,这个事件应触发在用户按下对话框的取消按钮之后.但关闭提示对话框的触发流程并不是那么简单.我们先来回顾下这个过程: 复制代码 代码如下: window.onbeforeunload = function(){
-
捕获浏览器关闭、刷新事件不同情况下的处理方法
在做一些关于会员在线的问题时,往往我们要根据览器是否关闭来判断用户是否下线,然后再从session和application中将此用户移除. 由于浏览器是无状态的,在这时候捕捉浏览器关闭会出现两种情况: 1.真正的关闭浏览器 (a.点击关闭按钮 b.右击任务栏关闭 c.按alt+F4关闭) 2.刷新浏览器. 那如何判断区分这两种动作呢? 一. Javascript代码处理方法: 复制代码 代码如下: function window.onbeforeunload() { //用户点击浏览器右上角关闭
-
javascript监听页面刷新和页面关闭事件方法详解
在我们的日常生活中,时常遇到这么一种情况,当我们在点击一个链接.关闭页面.表单提交时等情况,会提示我们是否确认该操作等信息. 这里就给大家讲讲javascript的onbeforeunload()和onunload()两个事件. 相同点: 两者都是在对页面的关闭或刷新事件作个操作. 不同点: unbeforeunload()事件执行的顺序在onunload()事件之前发生.(因为,unbeforeunload()是在页面刷新之前触发的事件,而onubload()是在页面关闭之后才会触发的). u
-
JavaScript高级程序设计 事件学习笔记
第12章 事件 1.事件流 1.1事件冒泡(IE事件流) □事件冒泡(event bubbling),即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接受,然后逐级向上传播到较为不具体的节点(文档). □所有浏览器均支持事件冒泡.Firefox.chrome.safari将事件一直冒泡到window对象. 1.2事件捕获(Netscape事件流) □不太具体的节点更早收到事件,而具体的节点最后收到节点. □Safari.chrome.Opera.firefox支持,但从window对象
随机推荐
- 两个强悍的php 图像处理类1
- 如何终止浏览器的Cahce页面?
- JQuery组件基于Bootstrap的DropDownList(完整版)
- react-native 完整实现登录功能的示例代码
- JS入门代码集合第1/4页
- MyEclipse连接MySQL数据库报错解决办法
- 解析如何用php screw加密php源代码
- 利用Query+bootstrap和js两种方式实现日期选择器
- JavaScript实现多种排序算法
- Spring Boot快速搭建Spring框架教程
- 轻松学习jQuery插件EasyUI EasyUI实现拖动基本操作
- asp.NET开发中正则表达式中BUG分析
- 给网站上的广告“加速”显示的方法
- 解决TreeSet类的排序问题
- c#动态加载卸载DLL的方法
- Cisco路由器全局调试\接口调试\协议调试
- 移动web开发之touch事件实例详解
- Android 封装Okhttp+Retrofit+RxJava,外加拦截器实例
- 解决vue页面刷新或者后退参数丢失的问题
- 详解Python爬取并下载《电影天堂》3千多部电影