javascript – Jquery Ajax beforeSend和成功,错误和完整

我有多个ajax函数的问题,其中第二个ajax post的beforeSend在第一个ajax的完整函数之前执行.

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

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

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

功能代码如下

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请求.

<script type="text/javascript">//<!--
 $(document).ready(function() {
    $('#restart').val(-1)
    $('#ajaxSubmit').click();
});
//--></script>

解决方法:

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

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,因此它不会删除该类.然后只有最后一个电话才能将其删除.

我无法测试它,让我知道它是否有效.