25

我们使用 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!";
    }
};
4

2 回答 2

16

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

但是，有些网站（例如 GMail）却反过来：如果您在仍有一些 ajax 请求待处理的情况下尝试离开页面，它会提示您有一些进程仍在运行，并让用户决定是在请求完成之前留在网站上，还是继续导航离开。

于 2009-12-15T08:51:51.797 回答
10

根据上面 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');
});

我从jquery ajaxError 文档'ajaxError'的评论部分获得了规范。我必须绑定到才能支持 chrome（IE 可以正常处理文档）。 当我绑定到时没有触发，所以这就是我有这个窗口/文档解决方案的原因。beforeunload$(window).ajaxError$(window)

于 2012-09-04T14:40:44.573 回答