关于捕获用户何时点击window.onbeforeunload的取消事件


Posted in Javascript onMarch 06, 2011

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 global variable in your "onbeforeunload" event and then look to see if that variable has been set in other functions. There is no way to get an immediate notification that the user has aborted a page unload.
The example code I used above to do an example of an "onbeforeunload" dialog is as follows:

var _isset=0; function demo() { 
window.onbeforeunload = function () { 
if (_isset==0) { 
_isset=1; // This will only be seen elsewhere if the user cancels. 
return "This is a demonstration, you won't leave the page whichever option you select."; 
} 
} 
_isset=0; 
window.location.reload(); 
return false; 
}

This code defines a global variabled named _isset, and then initializes it to zero. In our "onbeforeunload" event the variable is checked and if it's set to one, no unload dialog box will appear. The only way _isset could ever be one is if the user previously aborted a page unload.

But as you can see this method won't help you if you need to be immediately notified that that the user has finished dealing with the confirmation box. You can detect when it appears on the screen but there's no way to know when the user has finished interacting with it if the user clicked cancel (if the user clicked OK, then of course the unload event will have been tripped).
--------------------------------------------------------------
虽然如此,但还是有高手给出了如下代码 ^^

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html><head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<meta http-equiv="Content-Style-Type" content="text/css"> 
<meta http-equiv="Content-Script-Type" content="text/javascript"> 
<title>onbeforeunload test</title> 
<script type="text/javascript"><!-- 
window.onbeforeunload = function() { 
// in Firefox and Netscape 7.2+ the setTimeout or setInterval do not wait 
// to be executed until after the user clicks one of the buttons in the 
// confirm()-like box. //setTimeout("alert('hi from setTimeout()');",500); 
// setTimeout() and setInterval() aren't called when ok is clicked in 
// IE5-6/Win, but is called in IE7 when the time is short, but not when 
// it's longer, like 500 (a half second). 
window.unloadTimer = setInterval( 
"alert('hi from setInterval()');clearInterval(window.unloadTimer);",500); 
window.onunload = function() {clearInterval(window.unloadTimer);} 
return 'onbeforeunload testing'; 
} 
// --> 
</script> 
</head> 
<body> 
<h1>onbeforeunload test</h1> 
</body> 
</html>

<script type="text/javascript"> 
//<![CDATA[ 
var 
is_asked = false; window.onbeforeunload = 
function (ev) { 
var e = ev || window.event; 
window.focus(); 
if (!is_asked){ 
is_asked = true; 
var showstr = "CUSTOM_MESSAGE"; 
if (e) { //for ie and firefox 
e.returnValue = showstr; 
} 
return showstr; //for safari and chrome 
} 
}; 
window.onfocus = 
function (ev){ 
if (is_asked){ 
window.location.href = "http://www.google.com"; 
} 
} 
//]]> 
</script
Javascript 相关文章推荐
jQuery validate 中文API 附validate.js中文api手册
Jul 31 Javascript
对table和ul实现js分页示例分享
Feb 24 Javascript
JavaScript立即执行函数的三种不同写法
Sep 05 Javascript
浅谈jquery中delegate()与live()
Jun 22 Javascript
基于jquery实现省市联动效果
Nov 23 Javascript
使用EVAL处理jqchart jquery 折线图返回数据无效的解决办法
Nov 26 Javascript
JQuery 传送中文乱码问题的简单解决办法
May 24 Javascript
JavaScript 数组的进化与性能分析
Sep 18 Javascript
分享vue.js devtools遇到一系列问题
Oct 24 Javascript
React路由管理之React Router总结
May 10 Javascript
JS实现table表格内针对某列内容进行即时搜索筛选功能
May 11 Javascript
详解基于vue的服务端渲染框架NUXT
Jun 20 Javascript
js中将具有数字属性名的对象转换为数组
Mar 06 #Javascript
js 优化次数过多的循环 考虑到性能问题
Mar 05 #Javascript
淘宝搜索框效果实现分析
Mar 05 #Javascript
再论Javascript下字符串连接的性能
Mar 05 #Javascript
再论Javascript的类继承
Mar 05 #Javascript
Array的push与unshift方法性能比较分析
Mar 05 #Javascript
js定义对象或数组直接量时各浏览器对多余逗号的处理(json)
Mar 05 #Javascript
You might like
人族 Terran 基本策略
2020/03/14 星际争霸
ajax php传递和接收变量实现思路及代码
2012/12/19 PHP
Ubuntu中搭建Nginx、PHP环境最简单的方法
2015/03/05 PHP
PHP会话控制实例分析
2016/12/24 PHP
浅谈PHP中的那些魔术常量
2020/12/02 PHP
推荐:极酷右键菜单
2006/11/29 Javascript
学习jquery之一
2007/04/27 Javascript
可恶的ie8提示缺少id未定义
2014/03/20 Javascript
javascript实现九宫格相加数值相等
2020/05/28 Javascript
jQuery可见性过滤选择器用法示例
2016/09/09 Javascript
详解基于javascript实现的苹果系统底部菜单
2016/12/02 Javascript
JS去除字符串中空格的方法
2017/02/14 Javascript
node.js平台下利用cookie实现记住密码登陆(Express+Ejs+Mysql)
2017/04/26 Javascript
解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法
2017/05/05 Javascript
Mac系统下Webstorm快捷键整理大全
2017/05/28 Javascript
vue.js框架实现表单排序和分页效果
2017/08/09 Javascript
bootstrap confirmation按钮提示组件使用详解
2017/08/22 Javascript
javascript的delete运算符知识点总结
2019/11/19 Javascript
js和jquery判断数据类型的4种方法总结
2020/08/28 jQuery
[57:55]EG vs Fnatic 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
python实现自动发送邮件
2018/06/20 Python
python实现一个简单的udp通信的示例代码
2019/02/01 Python
浅析Python 读取图像文件的性能对比
2019/03/07 Python
python安装virtualenv虚拟环境步骤图文详解
2019/09/18 Python
python GUI库图形界面开发之PyQt5状态栏控件QStatusBar详细使用方法实例
2020/02/28 Python
在keras里实现自定义上采样层
2020/06/28 Python
Python抓包并解析json爬虫的完整实例代码
2020/11/03 Python
python 邮件检测工具mmpi的使用
2021/01/04 Python
香港卓悦化妆品官网:BONJOUR
2017/09/21 全球购物
NBA欧洲商店(西班牙):NBA Europe Store ES
2019/04/16 全球购物
个人自我评价分享
2013/12/20 职场文书
《鸿门宴》教学反思
2014/04/22 职场文书
2014年教学管理工作总结
2014/12/02 职场文书
司机个人年终总结
2015/03/03 职场文书
团干部培训班心得体会
2016/01/06 职场文书
索尼ICF-36收音机评测
2022/04/30 无线电