onbeforeunload方法
onbeforeunload与onunload事件
Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定。区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行。
Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。Onunload是无法阻止页面的更新和关闭的。而 Onbeforeunload 可以做到。
页面加载时只执行onload
页面关闭时先执行onbeforeunload,最后onunload
页面刷新时先执行onbeforeunload,然后onunload,最后onload。
1、onbeforeunload事件:
说明:目前三大主流浏览器中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>
2、onunload事件
用法:
·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>
一个判断页面是否真的关闭和刷新的好方法(最好用)
window.onbeforeunload=function (){
alert("===onbeforeunload===");
if(event.clientX>document.body.clientWidth && event.clientY < 0 || event.altKey){
alert("你关闭了浏览器");
}else{
alert("你正在刷新页面");
}
}
这段代码就是判断触发onbeforeunload事件时,鼠标是否点击了关闭按钮,或者按了ALT+F4来关闭网页,如果是,则认为系统是关闭网页,否则在认为系统是刷新网页。
转自http://zhidao.baidu.com/question/262057214.html
分享到:
相关推荐
### JavaScript关闭当前窗口知识点 #### 一、概述 在网页开发过程中,经常会遇到需要关闭当前窗口的需求,尤其是在一些特定的应用场景下,如弹窗、表单提交后等操作完成后的处理逻辑。通常我们可以通过JavaScript...
以上就是使用JavaScript关闭当前页面(窗口)不带任何提示的具体实现方法。掌握这些技术可以帮助开发者在不同情况下,根据需求精确地控制浏览器窗口的行为。在开发Web应用时,合理使用这些技术可以提升用户体验,但...
### JavaScript 页面关闭事件详解 #### 一、引言 在Web开发中,有时我们需要在用户即将离开当前页面时执行一些操作,例如询问用户是否确定离开(如果他们对表单进行了未保存的更改)、记录用户的某些行为等。这些...
通过上述方法,我们可以轻松地使用 JavaScript 实现通过 ESC 键关闭页面的功能。然而,在实际项目中还需要考虑更多的细节和用户体验因素。开发者可以根据具体需求进行调整和优化,以达到更好的用户体验效果。
在"javascript经典特效---窗口打开关闭程序.rar"这个压缩包中,我们重点探讨的是利用JavaScript实现窗口的打开与关闭功能,这在网页交互设计中是非常常见的需求。 在JavaScript中,`window`对象是全局对象,它代表...
### JavaScript关闭窗口和页面的方法 在Web开发过程中,有时候我们需要通过JavaScript来关闭当前窗口或页面。这不仅可以提高用户体验,还能让程序逻辑更加清晰。本文将详细介绍几种常用的JavaScript关闭窗口和页面...
此外,代码中还涉及到使用jQuery的`$.post`方法向服务器发送数据,这可以帮助记录用户的操作行为,例如,关闭页面或者刷新页面的时间。 需要注意的是,浏览器对于`onbeforeunload`事件的支持程度不一,而且在一些...
在JavaScript中,监听浏览器窗口关闭事件对于实现特定的用户交互或数据保存功能至关重要。下面将详细介绍几种常用的浏览器关闭事件监听方法。 1. 方式一:适用于IE浏览器,仅在关闭时提示 ```javascript window....
在Web开发过程中,我们常常需要监控用户与网页的交互行为,包括但不限于用户关闭浏览器窗口、刷新页面等动作。这些事件对于网站来说非常重要,可以用于实现各种功能,比如提醒用户保存未提交的数据或者记录用户的...
在JavaScript编程中,有时我们需要控制浏览器...总的来说,理解和掌握JavaScript的`window.onbeforeunload`事件及其兼容性处理是网页交互设计中的重要技能,特别是在需要确保用户完成关键操作后再离开页面的场景下。
<!...<... <... 关闭 [removed] var btn = document.getElementById('btn') btn.onclick = function () { if (confirm()) { window.close() } } [removed] </body> </html>
在页面被替换、关闭或浏览器窗口关闭前触发。此事件是在所有元素都被移除后才发生的,因此是执行清理工作(如清除定时器、断开数据库连接等)的理想时机。在给定代码中,`onunload`事件触发了`fclose()`函数,用于...
`javascript关闭子窗口`这个话题的核心在于`window.close()`方法。当你有子窗口的引用时,可以直接调用该方法关闭它。例如: ```javascript var childWindow = window.open("http://example.com"); // ... 某些操作...
关闭窗口的操作通常不直接使用JavaScript的`close()`方法,因为出于安全和隐私考虑,浏览器限制了脚本直接关闭非脚本创建的窗口。但可以通过在新窗口中添加一个关闭按钮,然后绑定点击事件来实现关闭窗口的功能。...
然而,仅依赖这两个事件来区分刷新和关闭页面并不完全准确,因为它们在两种情况下都会触发。为了更精确地判断,我们可以结合使用`window.performance.navigation`对象,它提供了关于页面导航的详细信息: - `...
AJAX(异步JavaScript和XML)技术使得网页可以在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。这对于实现动态加载的特效,如无限滚动或实时聊天功能非常有用。 九、Web API与Web组件 JavaScript的...
本文将深入探讨如何使用JavaScript实现浏览器标签页的关闭功能,这对于提升用户体验和网页交互性具有重要意义。 首先,理解浏览器环境下的JavaScript限制是至关重要的。由于安全原因,JavaScript不能直接关闭当前...
上述代码中,`confirm()`函数会在关闭页面前弹出一个对话框询问用户是否确定要关闭。如果用户点击“确定”,则执行`window.close()`关闭当前窗口;如果用户点击“取消”,则不执行任何操作。 ### 四、总结 通过以上...
《JavaScript网页设计300例》是一本涵盖了广泛JavaScript应用的实践教程,旨在帮助开发者和设计者提升在网页设计中的动态效果和交互体验。通过300个具体的例子,本书深入浅出地讲解了JavaScript在网页设计中的核心...
JavaScript是一种广泛应用于网页开发的脚本语言,它在浏览器端运行,为网页添加交互性和动态效果,极大地提升了用户体验。在“javascript几个网页特效”这个主题中,我们可以深入探讨JavaScript实现的一些常见和有趣...