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

 更新时间:2011年03月06日 17:15:47   作者:  
关于捕获用户何时点击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 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空数组的every()方法实践

    JavaScript空数组的every()方法实践

    every()方法用于检测数组中的所有元素是否都满足指定条件, 本文主要介绍了JavaScript空数组的every()方法实践,具有一定的参考价值,感兴趣的可以了解一下
    2024-03-03
  • JS target与currentTarget区别说明

    JS target与currentTarget区别说明

    target在事件流的目标阶段;currentTarget在事件流的捕获,目标及冒泡阶段。只有当事件流处在目标阶段的时候,两个的指向才是一样的,而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级)。
    2011-08-08
  • js实现根据身份证号自动生成出生日期

    js实现根据身份证号自动生成出生日期

    这篇文章主要介绍了js实现根据身份证号自动生成出生日期,需要的朋友可以参考下
    2015-12-12
  • 详解 Map 和 WeakMap 区别以及使用场景

    详解 Map 和 WeakMap 区别以及使用场景

    这篇文章主要介绍了详解 Map 和 WeakMap 区别以及使用场景,Map本质上是一个键值对的集合,WeakMap 只能将对象作为键名,下面来一起俩姐更多详细内容吧,希望这一篇文章能让你对 Map 有更好的理解,或者能够帮你理解 Map 和 WeakMap
    2022-01-01
  • HTML+CSS+JavaScript实现可拖拽模态框

    HTML+CSS+JavaScript实现可拖拽模态框

    这篇文章主要为大家详细介绍了HTML+CSS+JavaScript实现可拖拽模态框,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • JS去除数组重复值的五种不同方法

    JS去除数组重复值的五种不同方法

    去除数组重复值的方法有很多,本文整理了四种不同方式,在此与大家分享下,希望对大家有所帮助
    2013-09-09
  • javascript实现百度地图鼠标滑动事件显示、隐藏

    javascript实现百度地图鼠标滑动事件显示、隐藏

    这篇文章主要介绍了javascript实现百度地图鼠标滑动事件显示、隐藏的思路和方法,十分的实用,这里推荐给小伙伴们,有需要的朋友可以参考下。
    2015-04-04
  • 说明你的Javascript技术很烂的五个原因

    说明你的Javascript技术很烂的五个原因

    Javascript在互联网上名声很臭,但你又很难再找到一个像它这样如此动态、如此被广泛使用、如此根植于我们的生活中的另外一种语言。
    2011-04-04
  • Layer组件多个iframe弹出层打开与关闭及参数传递的方法

    Layer组件多个iframe弹出层打开与关闭及参数传递的方法

    今天小编就为大家分享一篇Layer组件多个iframe弹出层打开与关闭及参数传递的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 微信小程序webview中监听返回按钮实现步骤

    微信小程序webview中监听返回按钮实现步骤

    在微信小程序中webview返回键是一个非常实用的功能,它允许用户在嵌入的网页中返回到上一个页面,这篇文章主要给大家介绍了微信小程序webview中监听返回按钮的实现步骤,需要的朋友可以参考下
    2024-08-08

最新评论