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
分享到:
相关推荐
总的来说,捕获用户何时点击 `onbeforeunload` 取消事件是Web开发中的一个挑战。虽然可以通过设置全局变量和间接检测来尝试解决,但这种方法并不是非常可靠,且可能随着浏览器更新而失效。最佳实践通常是提供清晰的...
根据提供的部分代码片段和上下文信息,我们可以看到主要关注于`window.onbeforeunload`事件及其处理逻辑。 #### 二、基础知识介绍 1. **`window.onbeforeunload`**: - 这个事件在页面卸载前触发。 - 可以用来...
当用户通过点击浏览器的关闭按钮或通过其他方式(如刷新页面)离开当前页面时,此事件将被触发。由于其触发时机的特殊性,`onunload` 常被用来执行一些清理工作,如清除定时器、保存用户数据等。 **注意**:`...
本文将详细介绍如何使用JavaScript来捕获窗口关闭事件,并探讨两种常用的方法:重定义`window.onbeforeunload`事件和使用`onunload`方法。 #### 二、使用`window.onbeforeunload`事件 `window.onbeforeunload`事件...
总结来说,通过巧妙地结合`onbeforeunload`、`setTimeout`和`clearTimeout`,开发者可以创建一个机制来捕获用户是否取消了页面的关闭,从而提供更加智能的交互体验。尽管这种方法可能存在浏览器兼容性问题,但通过...
1. **`onbeforeunload`事件**:当浏览器窗口准备关闭时,如用户点击关闭按钮或导航到另一个页面,浏览器会触发`onbeforeunload`事件。开发者可以为这个事件注册一个回调函数,该函数将在页面卸载之前运行。在IE中,...
在JavaScript中,可以使用`window.onbeforeunload`或`window.onunload`事件来捕获页面刷新的瞬间。然后,我们需要阻止默认的刷新行为,这可以通过返回一个函数或者在事件处理函数中调用`event.preventDefault()`来...
总的来说,Vue.js提供了一种优雅的方式来处理窗口关闭和刷新事件,通过结合`window.onbeforeunload`事件和Vue的生命周期钩子,我们可以实现对用户离开页面时的控制,从而提升用户体验并保证数据的完整性。...
JavaScript中的`onunload`和`onbeforeunload`是两个与页面生命周期紧密相关的事件处理函数,它们主要用于在用户离开页面(例如,关闭浏览器窗口、点击刷新按钮或者导航到其他页面)时执行某些操作。这两个事件可以...
在JavaScript中,我们可以监听`window.onbeforeunload`事件,当用户尝试离开当前页面时触发一个警告对话框。例如: ```javascript window.onbeforeunload = function() { return '您确定要离开此页面吗?'; }; ```...
例如,`window.onbeforeunload`和`window.onload`事件可以帮助我们确定何时用户准备离开或加载新的页面。 4. **数据传输与存储**:收集到的URL信息可以被发送到服务器进行进一步分析或存储。这通常通过HTTP/HTTPS...
例如,通过`window.onpopstate`或`window.onbeforeunload`事件,开发者可以捕获用户尝试导航回历史记录中的行为,并执行自定义操作,如显示警告、阻止默认行为或者执行其他脚本。这种技术在某些情况下是有益的,比如...
在网页开发中,有时我们需要在...以上是关于捕获窗口关闭事件的基本知识,以及如何在JavaScript中使用 `onbeforeunload` 事件来实现特定功能。在实际应用中,应结合具体的业务需求和当前浏览器的特性进行适配和优化。
JavaScript事件模型是前端开发中处理用户交互的核心机制之一,主要包括了事件捕获、目标阶段和事件冒泡三个阶段,这个模型被广泛地理解为0-1-2级模型。 在描述中,文档内容被OCR扫描识别出的文字带有部分错误,但是...
例如,它可能使用事件监听器来捕获并阻止 `window.onbeforeunload` 或 `window.onload` 事件,以及 `window.resize` 和 `window.navigate` 事件,这些都是帧破坏常用的触发时机。 此外,该库可能还提供了自定义配置...
`onbeforeunload`事件在页面即将卸载时触发,这通常发生在用户尝试关闭窗口、刷新页面或导航到另一个URL之前。这个事件提供了一个机会来询问用户是否真的想要离开当前页面。如果返回一个字符串,浏览器会显示一个...
通常,这通过JavaScript的window.onbeforeunload或window.onunload事件来实现,而在服务器端,可以利用Page对象的Unload事件。开发者可以在此事件中释放资源,执行数据库操作,或者向服务器发送信息。 其次,页面...
这种方法通过JavaScript监听浏览器的`onbeforeunload`事件,当用户尝试关闭当前页面或切换到其他页面时,会自动调用指定的URL(如`logout.aspx`)来进行注销操作。 **具体实现代码:** ```javascript function ...
首先,`new_window.html`文件可能包含了触发弹出窗口的按钮或链接,其JavaScript代码会响应用户的点击事件。例如: ```html ()">打开弹出窗口 ``` 对应的JavaScript代码可能如下: ```javascript function ...
28. **退出提示**:`window.onbeforeunload`事件可以设置一个函数,当用户尝试离开页面时触发,以进行提示或确认。 29. **加载和卸载事件**:`window.onload`和`window.onunload`分别在页面加载完成和即将卸载时...