如何最好地处理过程中所造成的链路上用户点击的jQuery Ajax调用错误 [英] How best to handle errors during jquery ajax calls caused by user clicking on links

问题描述

我渐渐提高我的网站的AJAX-拉了一（TM），并在一些pretty的基本的错误处理最近增加。 我的呼叫被经由jquery的阿贾克斯（）方法制成，我显示错误向用户与show_error_box（消息）的功能 我通过返回脚本，服务器端验证处理我所有的阿贾克斯很容易 - 我只是发回调用show_error_box。对于其他错误，我只是把下面的code在我的阿贾克斯通话

 错误：函数（XHR，状态，错误）{
    show_error_box（有一个错误的服务器16通信; BR /＆gt;该领域一直没有更新＆LT; BR /＆gt;请检查您的网络连接）;
}
 

我发现这个交易很好地与大多数问题（无连接，超时等），但它不能很好地处理这种情况，当用户点击一个链接，而Ajax调用仍在进行中。该错误框开始显示，然后突然用户接走到新的页面。

什么是处理这种情况的更好的办法？我会像理想中显示的非侵入性的错误信息（如请等待更新完成），并在链接上点击忽略。任何建议，如何最好地实现这一点？

编辑：

我通过暂时禁用所有的链接，然后重新启用它们像这样解决了这个

  $。ajaxSetup（{
    beforeSend：功能（）{disable_links（）}，
    完成：函数（）{enable_links（）}，
    超时：15000
}）;

功能disable_links（）{
    $（'a'）的。每个（函数（）{
        如果（$（本）.attr（HREF））{
          $（本）的.d​​ata（HREF'，$（本）.attr（HREF））removeAttr（HREF）。
      }
    }）
}

功能enable_links（）{
    $（'a'）的。每个（函数（）{
        $（本）.attr（HREF'，$（本）的.d​​ata（HREF'））;
    }）
}
 

解决方案

也许你可以使用 BlockUI jQuery插件。这将prevent用户从点击链接，直到当前的AJAX请求返回：

  $（文件）.ajaxStart（$ blockUI）.ajaxStop（$ unblockUI。）;
 

I am gradually enhancing the ajax-tivity (TM) of my site and have recently added in some pretty basic error handling. My calls are being made via the jquery .ajax() method and I display errors to the user with a show_error_box(message) function I am handling all of my ajax by returning scripts so server-side validation was easy - I just send back a call to show_error_box. For other errors I have simply put the following code in my .ajax call

error: function(xhr, status, error) {
    show_error_box("There has been an error communicating with the server<br/>The field has not been updated<br/>Please check your internet connection");
}

I've found that this deals nicely with most issues (no connection, timeout, etc) but it deals poorly with the situation when a user clicks on a link while an ajax call is still in progress. The error box begins to display and then suddenly the user is whisked away to the new page.

What is the better way of handling this situation? I would ideally like a non-intrusive error message displayed (e.g. 'please wait until the update is finished') and the click on the link ignored. Any suggestions as to how to best achieve this?

EDIT:

I solved this by temporarily disabling all links then reenabling them like so;

$.ajaxSetup({  
    beforeSend: function() {disable_links()},
    complete: function() {enable_links()},
    timeout: 15000
});

function disable_links() {
    $('a').each(function() {
        if ($(this).attr('href')) {
          $(this).data('href', $(this).attr('href')).removeAttr('href');
      }
    })
}

function enable_links() {
    $('a').each(function() {
        $(this).attr('href', $(this).data('href'));
    })
}

解决方案

Maybe you can use the BlockUI jQuery plugin. This will prevent the user from clicking links until the current AJAX request returns:

$(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);

这篇关于如何最好地处理过程中所造成的链路上用户点击的jQuery Ajax调用错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！