JS 实现 tab 页面关闭事件监听

青旅半醒 2021-10-18 08:40 865阅读 0赞

#### chrome ####

#### IE、FoxFire etc. ####

//点击关闭或重载按钮
          window.onbeforeunload = function(event){
              return onBeforeUnload(event);
          }
          function onBeforeUnload(event){
              var clientBrowser = chargeBrowser();
              var isIE = document.all?true:false;//另一方法
              var evt = event ? event : (window.event ? window.event : null);
              if(clientBrowser=="IE"){
                  var n = evt.screenX - window.screenLeft;
                  var b = n > document.documentElement.scrollWidth - 20;
                  if(b && evt.clientY < 0 || evt.altKey){
                      console.log("IE关闭非刷新");
                      return confirm("您确定要离开系统么？IE关闭非刷新");
                  }else{
                      console.log("IE刷新非关闭");
                      return confirm("您确定要离开系统么？IE刷新非关闭");
                  }
              }else if (clientBrowser==="Chrome") {
                  clearCookie();
              }else{
                  if(document.documentElement.scrollWidth != 0){
                      console.log("FF刷新非关闭");
                      return confirm("您确定要离开系统么？FF刷新非关闭");
                  }else{
                      console.log("FF关闭非刷新");
                      return confirm("您确定要离开系统么？FF关闭非刷新");
                  }
              }
          }
          function chargeBrowser() {
              var userAgent = navigator.userAgent;
              var isOpera = userAgent.indexOf("Opera") > -1;
              if (isOpera) {
                  return "Opera"
              }else if(userAgent.indexOf("Firefox") > -1) {
                  return "Firefox";
              }else if(userAgent.indexOf("Chrome") > -1){
                  return "Chrome";
              }else if(userAgent.indexOf("Safari") > -1) {
                  return "Safari";
              }else if(userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
                  return "IE";
              }else if(userAgent.indexOf("Trident") > -1) {
                  return "Edge";
              }else if(userAgent.indexOf("QQ") > -1) {
                  return "QQ";
              }else{
                  return "";
              }
          }

\#全文毕  
欢迎关注微信公众号：Javall咖啡屋  
每天更新各种互联网技术（前后端、数据库、中间件、设计模式、数据结构、算法）学习心得体会  
![aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy8xMTE2NDM4Ni05ZmYzMTMwOTcxYjdjZGRlLmpwZw][]

[aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy8xMTE2NDM4Ni05ZmYzMTMwOTcxYjdjZGRlLmpwZw]: /images/20211018/a14278c04eb944b7895c67af6c8f2bc8.png