`

js 监听窗口关闭和刷新

阅读更多
Onunload与Onbeforeunload
Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定。区别在于onbeforeunload在onunload之前执行,它还可以阻止onunload的执行。

    Onbeforeunload也是在页面刷新或关闭时调用,Onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。Onunload是无法阻止页面的更新和关闭的。而 Onbeforeunload 可以做到。曾经做一个考试系统,涉及到防止用户半途退出考试(有意或者无意),代码如下:
  1. <script type="text/javascript">  
  2. <!--    
  3.     window.onbeforeunload = onbeforeunload_handler;  
  4.     window.onunload = onunload_handler;  
  5.     function onbeforeunload_handler(){  
  6.         var warning="确认退出?";          
  7.         return warning;  
  8.     }  
  9.       
  10.     function onunload_handler(){  
  11.         var warning="谢谢光临";  
  12.         alert(warning);  
  13.     }  
  14. // -->  
  15. </script>  
  16.    
  1. 这段代码在FF和IE上都能正确执行.再点击关闭按钮时首先触发obbeforeunload事件,点击否定时不执行onload事件.  
  1. 通常应用在 注销session等等登陆信息 等方面....  
  1. 这里一并推荐一个ActionScript3的好教程: <a href="http://gskinner.com/talks/as3workshop/">http://gskinner.com/talks/as3workshop/</a>  
 
运用onunload事件判断浏览器是刷新还是关闭窗口
 
function CloseOpen(event) { 
if(event.clientX<=0 && event.clientY<0) { 
alert("关闭"); 

else 

alert("刷新或离开"); 

 
  1. window.onbeforeunload = function() //author: meizz   
  2.        {   
  3.               var n = window.event.screenX - window.screenLeft;   
  4.               var b = n > document.documentElement.scrollWidth-20;   
  5.               if(b && window.event.clientY < 0 || window.event.altKey)   
  6.               {   
  7.                      alert("是关闭而非刷新");   
  8.                      window.event.returnValue = ""; //这里可以放置你想做的操作代码   
  9.               }   
  10.        }  
分享到:
评论

相关推荐

    JS针对浏览器窗口关闭事件的监听方法集锦

    在JavaScript中,监听浏览器窗口关闭事件对于实现特定的用户交互或数据保存功能至关重要。下面将详细介绍几种常用的浏览器关闭事件监听方法。 1. 方式一:适用于IE浏览器,仅在关闭时提示 ```javascript window....

    vuejs中监听窗口关闭和窗口刷新事件的方法

    以下是关于如何在Vue.js项目中实现监听窗口关闭和刷新事件的一些方法和知识点。 1. 使用window.onbeforeunload事件 在原生JavaScript中,可以使用window.onbeforeunload事件来监听窗口关闭和刷新的行为。该事件会在...

    js监听页面的刷新与关闭

    使用javascript实现监听页面的刷新与关闭,可在用户刷新或关闭窗口时执行相关操作。

    JS区分浏览器页面是刷新还是关闭

    在Web开发中,区分浏览器页面是刷新还是关闭的需求非常常见,这主要是为了优化用户体验和保证系统的操作逻辑。传统的做法是使用BOM(Browser Object Model)事件中的onbeforeunload事件,该事件会在页面即将卸载前...

    判断浏览器是刷新还是关闭窗口

    在网页中,刷新页面与关闭窗口虽然都会触发 `onunload` 事件,但我们可以通过监听其他事件来区分这两种情况。 1. **监听 `onbeforeunload` 事件** `onbeforeunload` 事件在 `onunload` 之前触发,并且可以被用来...

    JS监听关闭浏览器事件

    ### JS监听关闭浏览器事件 在Web开发中,有时我们需要对用户关闭浏览器窗口或标签页的行为进行监测,并在这些行为发生前执行某些操作。这通常涉及到`onbeforeunload`和`onunload`这两个事件处理程序。 #### 1. `...

    基于JavaScript判断浏览器到底是关闭还是刷新(超准确)

    因此,使用这些JavaScript事件来监控页面关闭和刷新的行为,需要进行充分的测试,并且要考虑到不同浏览器之间的兼容性问题。 此外,除了使用JavaScript之外,还可以考虑服务器端的逻辑来辅助判断。例如,可以通过...

    使用javascript验证窗口是关闭还是刷新

    为了更准确地检测浏览器窗口或选项卡的关闭及刷新事件,建议采用如上所述的`beforeunload`事件监听和时间戳对比方法。通过这些方法,我们可以有效地监控用户的操作,并据此做出相应的响应。希望本文能够帮助你在实际...

    模态窗口关闭时刷新父页面js文件

    当我们需要在用户关闭模态窗口后刷新其父页面时,JavaScript(简称js)提供了解决方案。 在JavaScript中,我们可以利用事件监听来处理模态窗口关闭的事件。首先,我们需要在模态窗口上设置一个关闭按钮,并为其添加...

    js监控IE火狐浏览器关闭、刷新、回退、前进事件.docx

    ### JS监控IE与火狐浏览器关闭、刷新、回退、前进事件 #### 一、引言 在Web应用开发过程中,有时需要对用户的浏览器行为进行监控,比如浏览器的关闭、刷新、前进或后退等操作。这对于提高用户体验、确保应用程序...

    Vue 实现监听窗口关闭事件,并在窗口关闭前发送请求

    实现Vue监听窗口关闭事件,并在关闭前发送请求,关键在于正确地使用 `beforeunload` 和 `unload` 事件,并且在适当的生命周期钩子中添加和移除事件监听器。在使用这些事件时,需要注意同步AJAX请求的限制和浏览器对...

    JS 关闭或刷新窗口时发生的事件

    通过上述示例,我们可以了解到在JavaScript中如何监听和响应窗口关闭或刷新事件,以及如何在这些事件中执行相应的操作。实际应用中,可能还需要根据不同的浏览器和安全策略进行调整,确保代码的兼容性和可靠性。在...

    javascript判断页面是否是刷新还是关闭

    在给定的压缩包文件中,`测试关闭页面问题.html`和`测试页面.html`可能是用于模拟和测试页面关闭和刷新场景的示例文件。你可以打开这些文件,根据上面的解释添加事件监听器和`performance.navigation.type`检查,以...

    判断页面是关闭还是刷新的js代码

    在探讨“判断页面是关闭还是刷新的js代码”这一主题时,我们首先需要理解网页生命周期中的几个关键事件:`onload`、`onunload`、`onbeforeunload`以及`onclose`。这些事件在网页加载、卸载或刷新过程中扮演着重要...

    弹出层关闭父页面刷新

    总的来说,实现“弹出层关闭后刷新父页面”的功能,主要涉及到JavaScript的事件监听和窗口操作,是前端开发中常见的交互设计。理解并掌握这个过程,对于提升用户体验和优化页面流程有着积极的作用。

    窗口刷新父窗口然后关闭

    综上所述,"窗口刷新父窗口然后关闭"这一功能的实现,不仅仅是前端编程的一个小技巧,还涉及到数据库的合理管理和性能优化,体现了前端技术与后端技术相结合的重要性。在实际开发中,开发者需要综合运用多种技能和...

    jsp与javascript配合,父窗口与子窗口之间刷新

    本示例探讨的是如何将JSP与JavaScript结合,实现父窗口与子窗口之间的数据通信及页面刷新功能,特别涉及了Ajax查询数据和表格渲染。以下是关于这些知识点的详细解释: 1. **JSP(JavaServer Pages)**:JSP是一种...

    Vue监听页面刷新和关闭功能

    本文将详细介绍如何使用Vue.js监听页面刷新和关闭事件,以及如何结合JavaScript事件来实现这一功能。 首先,Vue的生命周期钩子函数是处理这类问题的关键。在Vue组件中,`beforeDestroy`生命周期钩子可以用来在组件...

Global site tag (gtag.js) - Google Analytics