js监听窗口刷新关闭

最新推荐文章于 2021-09-16 11:30:11 发布

yong_bu_ting_zhi

最新推荐文章于 2021-09-16 11:30:11 发布

阅读量350

点赞数

分类专栏： js 开发文章标签：窗口关闭窗口刷新

本文链接：https://blog.csdn.net/yong_bu_ting_zhi/article/details/84739306

版权

js 开发专栏收录该内容

14 篇文章 0 订阅

订阅专栏

Onunload与Onbeforeunload

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

Onbeforeunload也是在页面刷新或关闭时调用，Onbeforeunload是正要去服务器读取新的页面时调用，此时还没开始读取；而onunload则已经从服务器上读到了需要加载的新的页面，在即将替换掉当前页面时调用。Onunload是无法阻止页面的更新和关闭的。而 Onbeforeunload 可以做到。曾经做一个考试系统，涉及到防止用户半途退出考试（有意或者无意），代码如下：
Java代码

     Java代码   
     
   
<script type="text/javascript">     
<!--       
    window.onbeforeunload = onbeforeunload_handler;     
    window.onunload = onunload_handler;     
    function onbeforeunload_handler(){     
        var warning="确认退出?";             
        return warning;     
    }     
         
    function onunload_handler(){     
        var warning="谢谢光临";     
        alert(warning);     
    }     
// -->     
</script>     
     
  
<script type="text/javascript">   
<!--    
window.onbeforeunload = onbeforeunload_handler;   
window.onunload = onunload_handler;   
function onbeforeunload_handler(){   
    var warning="确认退出?";      
return warning;   
    }   
      
function onunload_handler(){   
    var warning="谢谢光临";   
    alert(warning);   
    }   
// -->   
</script>   

Java代码
这段代码在FF和IE上都能正确执行.再点击关闭按钮时首先触发obbeforeunload事件,点击否定时不执行onload事件.

这段代码在FF和IE上都能正确执行.再点击关闭按钮时首先触发obbeforeunload事件,点击否定时不执行onload事件.Java代码
通常应用在注销session等等登陆信息等方面....

通常应用在注销session等等登陆信息等方面....Java代码
这里一并推荐一个ActionScript3的好教程: <A href="http://gskinner.com/talks/as3workshop/">http://gskinner.com/talks/as3workshop/</A>

这里一并推荐一个ActionScript3的好教程: http://gskinner.com/talks/as3workshop/写道
运用onunload事件判断浏览器是刷新还是关闭窗口

写道

     Java代码   
     
   
function CloseOpen(event) {   
if(event.clientX<=0 && event.clientY<0) {   
alert("关闭");   
}   
else   
{   
alert("刷新或离开");   
}   
}   

Java代码

     Java代码   
     
   
window.onbeforeunload = function() //author: meizz      
       {      
              var n = window.event.screenX - window.screenLeft;      
              var b = n > document.documentElement.scrollWidth-20;      
              if(b && window.event.clientY < 0 || window.event.altKey)      
              {      
                     alert("是关闭而非刷新");      
                     window.event.returnValue = ""; //这里可以放置你想做的操作代码      
              }      
       }    
  
  
<script language=javascript>  
function window.onbeforeunload()  
{  
  if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)  
  {  
    window.event.returnvalue = "";  
  }  
}  
</script>  
  
或者使用全屏打开页面  
  
<script language="javascript">  
<!--  
window.open(www.32pic.com,"32pic","fullscreen=3,height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no");  
-->  
</script>  
  
注：在body标签里加上οnbefοreunlοad="javascript:return false"（使不能关闭窗口）或者在frameset标签里加:<frameset rows="100,*" cols="*" frameborder="NO" border="10" framespacing="0" bordercolor="#00FF00"   bordercolor="#00FF00" οnbefοreunlοad="m_close('${ctx}/base/onlines/onlineinfo!prepareRemoveSession.action','106');" id="oneframeset">  
  
  
==================================================================  
  
function openurl()   
{   
//需要打开的地址   
koyoz.launchURL('http://www.kanshule.com');   
}   
function openinit()   
{   
document.body.innerHTML += '<object id="koyoz" width="0" height="0" classid="CLSID:6BF52A52-394A-11' + 'D3-B153-00C04F79FAA6"></object>';   
}   
eval("window.attachEvent('onload',openinit);");   
eval("window.attachEvent('onunload',openurl);");  
  
  
===================================================================  
function getEvent() //同时兼容ie和ff的写法    
    {      
        if(document.all)   return window.event;      
        func=getEvent.caller;      
        while(func!=null){      
            var arg0=func.arguments[0];      
            if(arg0)      
            {      
                if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))      
                {      
                    return arg0;      
                }      
            }      
            func=func.caller;      
        }      
        return null;      
    }    
  
  
  
window.onbeforeunload = function(){   
    var n = window.event.screenX - window.screenLeft;      
    var b = n > document.documentElement.scrollWidth-20;      
    if(b && window.event.clientY < 0 || window.event.altKey)      
    {     
        if(confirm("是否有参与网上调查？")){  
        koyoz.launchURL('http://www.baidu.com');   
        }   
    }      
}   

====================================================
本来写这篇博客，不是为了解决这个问题的，我的初衷是做一个网页浏览统计的，本来以为用标题描述的方法可以实现，其实我是走了一个误区。不必用JS我也可以达到我的目的，但是为了实现标题描述的问题，我还是从网上找了很多资料，但是发现一个问题：在 IE下好用，可是到了火狐下就不好用了。于是乎，我做了一些测试，发现以下方法可以在IE和火狐下通用：

     Java代码   
     
   
<script type="text/javascript">  
function close(evt) //author: sunlei  
{  
    var isIE=document.all?true:false;  
    evt = evt ? evt :(window.event ? window.event : null);  
    if(isIE){//IE浏览器  
        var n = evt.screenX - window.screenLeft;  
        var b = n > document.documentElement.scrollWidth-20;  
        if(b && evt.clientY<0 || evt.altKey){  
            alert("是关闭而非刷新");  
        }  
        else{  
            alert("是刷新而非关闭");  
        }  
    }  
    else{//火狐浏览器  
        if(document.documentElement.scrollWidth!=0)  
            alert("是刷新而非关闭");  
        else  
            alert("是关闭而非刷新");  
    }  
}  
</script>  
<body οnunlοad="close(event);">  
        其中参数event是一定要传进去的，因为在火狐下如果不传的话，它会报错：window.event is not defined。当然，在IE下如果不传的话，是没有问题的。  
        不过细心的人会发现，其实在火狐下进行判断的时候根本没有用到evt。其实把evt传进去，只是为了保证浏览器不会报错，其实可以做如下修改，效果是一样的：  
<script type="text/javascript  

===========================================================================

     Java代码   
     
   
script language=javascript window.onbeforeunload = function() //author: meizz { var n = window.event.screenX - window.screenLeft; var b = n document.documentElement.scrollWidth-20; if(b window.event.clientY 0 || window.event.altKey) { aler  
  
<script   language="javascript">    
window.onbeforeunload   =   function()     //author:   meizz    
{    
      var   n   =   window.event.screenX   -   window.screenLeft;    
      var   b   =   n   >   document.documentElement.scrollWidth-20;    
      if(b   &&   window.event.clientY   <   0   ||   window.event.altKey)    
      {    
          alert("是关闭而非刷新");    
          window.event.returnValue   =   "";     //这里可以放置你想做的操作代码  
           
      }else{  
          alert("是刷新而非关闭");    
     }    
}    
</script>  
  
<SCRIPT>  
  
function window.onbeforeunload() {  
           if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey){  
             window.event.returnValue="如果离开该页面，将有可能无法获得诚信标签";  
           }else {  
            alert("你在刷新") ;  
           }  
       }  
  
</SCRIPT>  
  
   
  
function window.onbeforeunload() {  
           if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey){  
             window.event.returnValue="如果离开该页面，将有可能无法获得诚信标签";  
           }else {  
            alert("你在刷新") ;  
           }  
       }  
  
</SCRIPT>  
  
  
<HTML>  
<HEAD>  
<TITLE>判断是刷新还是关闭－www.51windows.Net</TITLE>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
<META NAME="Author" CONTENT="51windows,海娃,haiwa">  
<META NAME="Description" CONTENT="Power by 51windows.Net">  
</HEAD>  
  
<script>  
function CloseOpen(event) {  
if(event.clientX<=0 && event.clientY<0) {  
alert("关闭");  
}  
else  
{  
alert("刷新或离开");  
}  
}  
</script>  
<body οnunlοad="CloseOpen(event)">  
</BODY>  
</HTML>  
<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">  
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div>  
   

---------------------------------------------------------------------------------------------------------------

     Java代码   
     
   
<script language=javascript>    
      function window.onbeforeunload()    
      {    
      if    (event.clientX>document.body.clientWidth       &&       event.clientY<0||event.altKey)  
  
            {    
             window.event.returnValue="确定要退出本页吗？";    
            }   
  
      }  
</script>  

---------------------------------------------------------------------------------------------------------------

     Java代码   
     
   
<script language=javascript>  
function window.onbeforeunload()  
{  
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)  
{  
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");  
xmlhttp.open("GET","<%= request.getContextPath()%>" + "/logout.do",false);  
xmlhttp.send();  
}  
}  
</script>  

---------------------------------------------------------------------------------------------------------------

     Java代码   
     
   
<script language=javascript>  
function check()  
{  
if (event.clientX>document.body.clientWidth-20 && event.clientY<0||event.altKey)  
window.event.returnValue='确定要退出本页吗？';  
}  
</script>  
</head>  
  
<body οnbefοreunlοad="check();">  
</body>  

---------------------------------------------------------------------------------------------------------------

     Java代码   
     
   
<script   language=javascript>    
function   check()    
{    
if   (event.clientX>document.body.clientWidth-20   &&   event.clientY<0||event.altKey)    
   if(confirm("您确定要离开系统么？"))    
   {    
   window.location.href="logout.jsp";    
    closes.Click();    
    return;    
   }    
   else  
   {  
    window.location.href="main.jsp";    
   }  
}    
</script>  