当前位置：首页 > 资讯 > 技术文档

浅谈window.onbeforeunload() 事件调用ajax

时间：2021-07-21 01:05 编辑：来源：阅读：
扫一扫，手机访问

摘要：浅谈window.onbeforeunload() 事件调用ajax

经常有这样的需求，就是在离开某个web页面时，用户不一定点注销，这样会导致会话不能及时销毁。为实现用户离开页面时，自动注销功能，需要在web页面的onbeforeunload事件处理函数中发送注销命令。这个地方大多用Ajax实现。有时还涉及到跨域访问的问题。这个地方就存在浏览器的兼容性问题。浏览器在处理这个需求时的不兼容性有如下两点: 1、处理Ajax时的不兼容性，这里使用jQuery来解决。 2、在发送Ajax请求时的不兼容性 [b]主要代码如下:[/b]

function logout() { 
        var logoutURL = "xxxx"; //用于注销用户的url 
        if (logoutURL == "") return; 
        var userAgent = navigator.userAgent.toLowerCase(); 
        if(userAgent.indexOf("msie")>-1) { //IE 
          $.ajax({ url: logoutURL, crossDomain: true, async: false, dataType: "jsonp" }); 
        }else { //FireFox Chrome 
          $.ajax({ url: logoutURL, async: false }); 
        } 
      } 
 
      window.onbeforeunload = function () { 
        logout(); 
      };

[b]代码说明：[/b] firefox在处理js时的安全级别较高，很多IE、Chrome中js可以使用的权限在Friefox中被限制，因此通过

if(userAgent.indexOf("msie")>-1) { //IE
          
        }else { //FireFox Chrome
          
        }

这段代码来判断当前浏览器类型。针对Firefox、Chrome的兼容代码如下：

$.ajax({ url: logoutURL, async: false });

async需要设为false，即为同步，不能采用true异步的方式，否则请求有可能发不出去。其实Chrome也适用于下面针对IE的代码，在关掉浏览器时会自动发送注销命令，但是点浏览器的刷新按钮时也希望能自动注销用户时，Chrome就只能采用上面这行代码才能发出注销请求针对IE的兼容代码如下:

$.ajax({ url: logoutURL, crossDomain: true, async: false, dataType: "jsonp" });

crossDomain设置为true是为了解决跨域访问问题，如果不存在这个问题，这个属性可以忽略。async属性最好也设成false，true也可以。dataType:"jsonp"这个属性也是为解决跨域访问问题，和crossDomain配合使用，不存在跨域问题，这两个属性可省略。以上代码在IE9、Chrome27、Firefox21测试通过。以上就是小编为大家带来的浅谈window.onbeforeunload() 事件调用ajax（标题）全部内容了，希望大家多多支持编程素材网~

全部评论(0)

上一篇：避免jQuery名字冲突 noConflict()方法
下一篇：jQuery示例收集

资讯排行榜
更多>>