Jquery Ajax beforeSend和成功，错误和完整

我有多个ajax函数的问题，其中第二个 ajax post的beforeSend在第一个 ajax的complete函数之前执行。

我在发送之前添加到占位符的加载类正在为第一个ajax调用工作。 但是，在第一个ajax请求完成后不久，该类将被删除，并且永远不会再次追加第二个和更多的调用（记住递归调用）。

调试时显示第一个调用第二个ajax调用的beforeSend函数，稍后调用第一个ajax调用的complete函数。 这是显而易见的，因为从第一个ajax调用中插入页面的返回数据开始第二次调用。

简而言之，它是混乱的。 有什么办法可以解决这个问题吗？

function代码如下

 function AjaxSendForm(url, placeholder, form, append) { var data = $(form).serialize(); append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only $.ajax({ type: 'POST', url: url, data: data, beforeSend: function() { // setting a timeout $(placeholder).addClass('loading'); }, success: function(data) { if (append) { $(placeholder).append(data); } else { $(placeholder).html(data); } }, error: function(xhr) { // if error occured alert("Error occured.please try again"); $(placeholder).append(xhr.statusText + xhr.responseText); $(placeholder).removeClass('loading'); }, complete: function() { $(placeholder).removeClass('loading'); }, dataType: 'html' }); } 

并且数据包含以下javascript / jquery片段，用于检查和启动另一个ajax请求。

 // 

Answer 1

也许您可以尝试以下方法：

 var i = 0; function AjaxSendForm(url, placeholder, form, append) { var data = $(form).serialize(); append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only $.ajax({ type: 'POST', url: url, data: data, beforeSend: function() { // setting a timeout $(placeholder).addClass('loading'); i++; }, success: function(data) { if (append) { $(placeholder).append(data); } else { $(placeholder).html(data); } }, error: function(xhr) { // if error occured alert("Error occured.please try again"); $(placeholder).append(xhr.statusText + xhr.responseText); $(placeholder).removeClass('loading'); }, complete: function() { i--; if (i <= 0) { $(placeholder).removeClass('loading'); } }, dataType: 'html' }); } 

这样，如果在complete语句之前调用beforeSend语句， i将大于0，因此它不会删除该类。 然后只有最后一个电话才能将其删除。

我无法测试它，让我知道它是否有效。

Answer 2

使用jQuery的promise API实际上要容易得多：

 $.ajax( type: "GET", url: requestURL, ).then((success) => console.dir(success) ).failure((failureResponse) => console.dir(failureResponse) ) 

或者，您可以将bind函数传递给每个结果回调; 参数的顺序是:( (success, failure) 。 只要指定具有至少1个参数的函数，就可以访问响应。 因此，例如，如果您想检查响应文本，您可以简单地执行以下操作：

 $.ajax( type: "GET", url: @get("url") + "logout", beforeSend: (xhr) -> xhr.setRequestHeader("token", currentToken) ).failure((response) -> console.log "Request was unauthorized" if response.status is 401