如果用户在页面加载完成之前离开页面,则会触发jQuery ajaxError()处理程序

Question

我们使用jQuery的全局ajaxError()处理程序来警告用户任何AJAX失败:

$(document).ajaxError(function() {  
    $("There was a network or server error. Please try again later.").dialog({  
        title: "Error",  
        modal: true,  
        resizable: false,  
        buttons: { 'Ok': function() { (this).dialog("close"); } }  
    });  
});  

不幸的是,如果用户在完成加载之前离开页面,也会触发此全局错误处理程序.以下是重现错误的步骤:

1. 用户访问页面A,其中包含通过AJAX加载的元素.
2. 页面A上的AJAX元素开始加载.
3. 在页面A上的AJAX元素完成加载之前,用户单击链接以访问页面B.
4. 在浏览器重定向到页面B之前,会短暂显示错误对话框.

知道如何在访问新页面的用户直接引起错误时,如何让ajaxError()不被触发？

更新:在结合评论中的建议后,现在是我的代码:

// I added a 3 second delay to our error dialog, enough time
// for the user to leave for a new page:
$(document).ajaxError(function() {
    setTimeout(my_error_handler, 3000);
});

// Warn user before leaving page if AJAX is still loading.
// Not sure I'll keep this:
$(document).ajaxStart(function() {
    ajaxing = true;
});

$(document).ajaxStop(function() {
    ajaxing = false;
});

window.onbeforeunload = function() {
    if (typeof(ajaxing) != 'undefined' && ajaxing) {
        return "Page elements are still loading!";
    }
};

Answer 1

是的,如果用户导航到另一个页面,xhr将中止,这实际上是一次不成功的通信.一个解决方案是为onbeforeunload事件注册一个监听器,并解除绑定ajaxError,基本上说:用户即将离开页面,所以我不希望被告知可能出现的ajax错误.

但是,有些网站,比如GMail,反过来说:如果你仍然有一些ajax请求未决,你会尝试离开页面,它会提示你有一些进程仍在运行,并让用户决定是否在请求完成之前留在网站上,或继续导航.

Answer 2

基于David Hedlund上面的回答,这里的代码对我有用:

//enable global ajax error handling
$(document).ajaxError(function (event, request, settings) {
    //your error handling code here
});

//user leaving page so ignore any unfinished ajax loads
$(window).bind('beforeunload', function () {
    $(document).unbind('ajaxError');
});

我'ajaxError'从jquery ajaxError文档的评论部分获得了规范.我必须绑定beforeunload以$(window)支持chrome(IE文件正常工作). .ajaxError当我绑定时没有触发,$(window)所以这就是我有这个窗口/文档解决方案的原因.