码迷,mamicode.com
首页 > 其他好文 > 详细

beforeunload事件

时间:2014-08-01 12:57:01      阅读:223      评论:0      收藏:0      [点我收藏+]

标签:style   blog   color   os   strong   io   for   cti   

1.beforeunload事件:

  beforeunload事件在当页面卸载(关闭)或刷新时调用,事件触发的时候弹出一个有确定和取消的对话框,确定则离开页面,取消则继续待在本页。handler可以设一个返回值作为该对话框的显示文本。

1 window.addEventListener(‘beforeunload‘,handler);
var handler = function(event) {
            event = event || window.event;
            // 如果内容为空,那么后面就不管了,直接退出
            var _isEmpty = function() {
                var editorForm = document.getElementById(‘editorForm‘);if (/*表单为空*/) {
                    return true;
                }
                return false;
            };

            if (_isEmpty()) {
                return;
            }
            var msg = "您确定不保存您的日志内容就离开页面吗?";
            event.returnValue = msg;
            return msg;
        }

以下操作会触发beforeunload事件

   ·关闭浏览器窗口 
  ·通过地址栏或收藏夹前往其他页面的时候 
  ·点击返回,前进,刷新,主页其中一个的时候 
  ·点击 一个前往其他页面的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+ 

在页面刷新的情况下不触发该事件:

 

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)   
      {   
          alert("是关闭而非刷新");   
          window.event.returnValue   =   "是否关闭?";
      }else{
             alert("是刷新而非关闭");   
     }   
}

 

 

 

  

beforeunload事件,布布扣,bubuko.com

beforeunload事件

标签:style   blog   color   os   strong   io   for   cti   

原文地址:http://www.cnblogs.com/lizhiyong1010/p/3884362.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!