关于捕获用户何时点击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 相关文章推荐
一个报数游戏js版(约瑟夫环问题)
Aug 05 Javascript
node.js中的fs.openSync方法使用说明
Dec 17 Javascript
CSS javascript 结合实现悬浮固定菜单效果
Aug 23 Javascript
js表单处理中单选、多选、选择框值的获取及表单的序列化
Mar 08 Javascript
JavaScript学习小结之被嫌弃的eval函数和with语句实例详解
Aug 01 Javascript
javascript淘宝主图放大镜功能
Oct 20 Javascript
JavaScript数据结构之广义表的定义与表示方法详解
Apr 12 Javascript
详解利用 Express 托管静态文件的方法
Sep 18 Javascript
JS对日期操作封装代码实例
Nov 08 Javascript
JS实现炫酷轮播图
Nov 15 Javascript
Js数组扁平化实现方法代码总汇
Nov 11 Javascript
详解如何使用Node.js实现热重载页面
May 06 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
PHP Zip解压 文件在线解压缩的函数代码
2010/05/26 PHP
浅析PHP绘图技术
2013/07/03 PHP
web server使用php生成web页面的三种方法总结
2013/10/28 PHP
php编程中echo用逗号和用点号连接的区别
2016/03/26 PHP
PHP实现页面静态化的超简单方法
2016/09/06 PHP
php+mysql开发中的经验与常识小结
2019/03/25 PHP
从盛大通行证上摘下来的身份证验证js代码
2011/01/11 Javascript
javascript常用对话框小集
2013/09/13 Javascript
ExtJS4利根据登录后不同的角色分配不同的树形菜单
2014/05/02 Javascript
JS实现图片放大镜效果的方法
2015/02/27 Javascript
javascript正则表达式总结
2016/02/29 Javascript
JSONP和批量操作功能的实现方法
2016/08/21 Javascript
Query常用DIV操作获取和设置长度宽度的实现方法
2016/09/19 Javascript
Javascript 获取鼠标当前的位置实现方法
2016/10/27 Javascript
微信小程序-详解数据缓存
2016/11/24 Javascript
实例分析nodejs模块xml2js解析xml过程中遇到的坑
2017/03/18 NodeJs
自定义PC微信扫码登录样式写法
2017/12/12 Javascript
js隐式转换的知识实例讲解
2018/09/28 Javascript
jQuery实现ajax的嵌套请求案例分析
2019/02/16 jQuery
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
2019/07/03 jQuery
在vue项目中封装echarts的步骤
2020/12/25 Vue.js
python del()函数用法
2013/03/24 Python
在Python中使用异步Socket编程性能测试
2014/06/25 Python
10种检测Python程序运行时间、CPU和内存占用的方法
2015/04/01 Python
python中报错&quot;json.decoder.JSONDecodeError: Expecting value:&quot;的解决
2019/04/29 Python
Django--权限Permissions的例子
2019/08/28 Python
python打包成so文件过程解析
2019/09/28 Python
基于python实现ROC曲线绘制广场解析
2020/06/28 Python
Pytorch 扩展Tensor维度、压缩Tensor维度的方法
2020/09/09 Python
不用游标的SQL语句有哪些
2012/09/07 面试题
白酒市场营销方案
2014/02/25 职场文书
平安家庭示范户事迹
2014/06/02 职场文书
民主生活会对照检查材料思想汇报
2014/09/27 职场文书
2014年人事行政工作总结
2014/12/03 职场文书
Java8中Stream的一些神操作
2021/11/02 Java/Android
关于PHP数组迭代器的使用方法实例
2021/11/17 PHP