onbeforeunload与onunload事件
Onunload，onbeforeunload都是在刷新或关闭时调用，可以在<script>脚本中通过 window.onunload来指定或者在<body>里指定。区别在于onbeforeunload在onunload之前执行，它还可 以阻止onunload的执行。
说明：目前三大主流浏览器中firefox和IE都支持onbeforeunload事件,opera尚未支持。
用法：
·object.onbeforeunload = handler
·<element onbeforeunload = “handler” … ></element>
描述：
事件触发的时候弹出一个有确定和取消的对话框，确定则离开页面，取消则继续待在本页。handler可以设一个返回值作为该对话框的显示文本。
·关闭浏览器窗口
·通过地址栏或收藏夹前往其他页面的时候
·点击返回，前进，刷新，主页其中一个的时候
·点击 一个前往其他页面的url连接的时候
·调用以下任意一个事件的时候：click，document write，document open，document close，window close ，window navigate ，window NavigateAndFind,location replace,location reload,form submit.
·当用window open打开一个页面，并把本页的window的名字传给要打开的页面的时候。
·重新赋予location.href的值的时候。
·通过input type=”submit”按钮提交一个具有指定action的表单的时候。
可以用在以下元素：
·BODY, FRAMESET, window
平台支持：
IE4+/Win, Mozilla 1.7a+, Netscape 7.2+, Firefox0.9+
示例：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>onbeforeunload测试</title>
<script>
function checkLeave(){
event.returnValue="确定离开当前页面吗？";
}
</script>
</head>
<body onbeforeunload="checkLeave()">
</body>
</html>
但是onbeforeunload有个小毛病，就是页面刷新时，他还是会调用到onbeforeunload，为什么？其实刷新就相当于关闭了这个IE再重新打开的意思，因此还是会调用到onbeforeunload。
究竟怎么解决刷新不调用onbeforeunload呢？
网上提供很多方法，本人觉得最实用还是以下这段JS
window.onbeforeunload = function(){
var n = window.event.screenX - window.screenLeft;
var b = n > document.documentElement.scrollWidth-20;
if(b && window.event.clientY < 0 || window.event.altKey)
{
alert("是关闭而非刷新");
window.event.returnValue = "是否关闭？";
}else{
alert("是刷新而非关闭");
}
}
用法：
·object.onbeforeunload = handler
·<element onbeforeunload = "handler"></element>
当用户关闭一个页面时触发 onunload 事件。
触发于：
·关闭浏览器窗口
·通过地址栏或收藏夹前往其他页面的时候
·点击返回，前进，刷新，主页其中一个的时候
·点击 一个前往其他页面的url连接的时候
·调用以下任意一个事件的时候：click，document write，document open，document close，window close ，window navigate ，window NavigateAndFind,location replace,location reload,form submit.
·当用window open打开一个页面，并把本页的window的名字传给要打开的页面的时候。
·重新赋予location.href的值的时候。
·通过input type=”submit”按钮提交一个具有指定action的表单的时候。
示例：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>onunload测试</title>
<script>
function checkLeave(){
alert("欢迎下次再来！");
}
</script>
</head>
<body onunload="checkLeave()">
</body>
</html>
onbeforeunload与onunload事件的更多相关文章
- 【原】js离开页面执行函数 onbeforeunload与onunload事件
在最近的项目中,需要做到一个时间,就是用户离开页面的时候,我需要缓存页面其中一部分的内容,但是我不需要用户刷新的时候也缓存,我只希望在我用户离开的时候 执行这个函数.百度之,有onbeforeunlo ...
- onunload事件和onbeforeunload事件
记录知识点背景:在做一个h5项目时,在统计事件时有这样一个需求, 希望能统计到用户是从第几页离开的,用到了这个知识点.在此记录. window.onunload 1.定义和用法 onunload事件在 ...
- 关闭浏览器事件 onbeforeunload和onunload
在做毕设的时候,需要在关闭浏览器的时候向后台服务器修改用户在线状态.首先讲一下 onbeforeunload 和 onunload(都是在刷新或关闭时调用) 的区别: (1)onbeforeunloa ...
- onunload事件不触发的探索
如果现有一需求:浏览器页面关闭时弹出一个对话框,询问是否要退出,应该怎么做呢? 可用onunload事件来实现,该事件会在刷新和关闭页面时执行 我用如下3种方法绑定该事件,但所有主流浏览器都无法 ...
- 10、网页制作Dreamweaver（扩展：各浏览器对 onunload 事件的支持与触发条件实现有差异）
标准参考 在 HTML 4.01 规范中关于 onunload 事件的描述是:当 document 从 window 中移除时,触发 onunload 事件. 关于 HTML 4.01 规范中 onu ...
- jsp关闭或刷新浏览器（解决浏览器不兼容），请求后台onbeforeunload、onunload
jsp关闭或刷新浏览器(解决浏览器不兼容),请求后台 onbeforeunload.onunload 1.看代码: function test(e) { var json = "退出,清理 ...
- onunload事件火狐不支持，在IE浏览器中，只有刷新时该事件才发生
onunload事件火狐不支持,在IE浏览器中,只有刷新时该事件才发生
- javascript--BOM的onload事件和onunload事件
1.onload事件 onload,页面加载后执行,所谓页面加载完成,指页面上所有的元素创建完毕,引用的所有的外部资源(js.css.图片)等下载完毕. 所以onload执行的比较晚,因为如果页面上有 ...
- onload 和 onunload 事件
onload 和 onunload 事件会在用户进入或离开页面时被触发. onload 事件可用于检测访问者的浏览器类型和浏览器版本,并基于这些信息来加载网页的正确版本. onload 和 onunl ...
随机推荐
- TextBlock截断字符显示为....
添加: TextTrimming="CharacterEllipsis" 到TextBlock中, 即可让TextBlock 支持截断字符显示为...
- Centos6.5 安装pip
1.下载 sudo wget https://bootstrap.pypa.io/get-pip.py --no-check-certificate 2.安装 python get-pip.py 参 ...
- .NET接入微信支付(一)JS API接入 V3
前段时间刚接完银联支付,完事后又接了微信支付,前段时间一直急着上线,微信的接入一直没有时间处理,今天我们就来整理一下微信支付的接入方法和要点. 配置: 首先呢微信支付需要通过审核,审核啥的准备工作我就 ...
- 【转】Pro Android学习笔记（二四）：用户界面和控制（12）：Style和Theme
目录(?)[-] 静态格式 代码中设定 Style Theme 静态格式 在res/values中设置静态的Style,在资源中设置静态Style可使用的HTML格式有<i> <u& ...
- PAT1106(BFS)
PAT 1106 思路 BFS用在tree上,这一个题里主要关注的是用vector去保存每一个节点所连接的子节点,当BFS 时,一旦发现该节点下面没有子节点,这一层一定是最短的路径,然后用当前的层数去 ...
- JS开发中的一些小技巧和方法
生成指定范围内的随机数 当我们需要获取指定范围(min,max)内的整数的时候,下面的代码非常适合:这段代码用的还挺多的. function setRadomNum(min,max){ return ...
- sql查询将列里面的值替换为别的值但是实际值不变
数据库有一张表BUG(缺陷记录表) 里面有字段severity(严重程度): severity的值实际为1,2,3,4,但希望在查询结果中将severity的1,2,3,4值显示为其他的值,但seve ...
- 全面解析JS字符串和正则表达式中的match、replace、exec等函数
转自:https://www.jb51.net/article/87730.htm 正则表达式(regular expression)描述了一种字符串匹配的模式,可以用来检查一个串是否含有某种子串.将 ...
- redis持久化 发布消息与订阅
vi /usr/local/redis/etc/redis.conf 快照方式: save 900 1 save 300 10 save 60 10000 aof方式: ap ...
- JDBC操作MySQL(crud)
这两天复习了一下JDBC操作MySQL,把crud操作的例子记一下, 类库链接(mysql-connector-java-5.1.37-bin.jar):http://files.cnblogs.co ...