如何在成功调用另一个 ajax 调用后恢复 ajax 成功中的代码

Question

我有一个使用 $.ajax 的函数。在成功部分，我有 3 个功能。第一个运行正常。第二个包含另一个 $.ajax 调用。内部 $.ajax 调用工作正常，但我最初的 $.ajax 调用中的第三个函数没有运行。调试整个事情，它甚至没有达到第三个功能。

这是整个事情的简化版本

function InitialFunction() {

$.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        data: myData,
        url: myUrl,
        async: false,
        beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Accept", "application/json");
            XMLHttpRequest.setRequestHeader("X-HTTP-Method", "MERGE");
        },
        success: function (data, textStatus, XmlHttpRequest) {
            FirstFunction();
            SecondFunction();
            ThirdFunction(); // This is never reached
        },
        error: function (XmlHttpRequest, textStatus, errorThrown) {
            // Handle Errors
        }
    });
}
function FirstFunction(){
    // Do stuff
}
function SecondFunction() { 
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        data: myData,
        url: myUrl,
        async: false,
        beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Accept", "application/json");
            XMLHttpRequest.setRequestHeader("X-HTTP-Method", "MERGE");
        },
        success: function (data, textStatus, XmlHttpRequest) {
            console.log("Stuff happened");
        },
        error: function (XmlHttpRequest, textStatus, errorThrown) {
            // Handle Errors
        }
    });
}
function ThirdFunction() {
    // Do more stuff
}

谢谢。

Answer 1

你有没有尝试过使用延迟(注意 SecondFunction 中 $.ajax 的返回和调用 ThirdFunction 的 .then(：

function InitialFunction() {

$.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        data: myData,
        url: myUrl,
        async: false,
        beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Accept", "application/json");
            XMLHttpRequest.setRequestHeader("X-HTTP-Method", "MERGE");
        },
        success: function (data, textStatus, XmlHttpRequest) {
            FirstFunction();
            SecondFunction()
                .then(ThirdFunction()); // This is never reached
        },
        error: function (XmlHttpRequest, textStatus, errorThrown) {
            // Handle Errors
        }
    });
}
function FirstFunction(){
    // Do stuff
}
function SecondFunction() { 
    return $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        data: myData,
        url: myUrl,
        async: false,
        beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Accept", "application/json");
            XMLHttpRequest.setRequestHeader("X-HTTP-Method", "MERGE");
        },
        success: function (data, textStatus, XmlHttpRequest) {
            console.log("Stuff happened");
        },
        error: function (XmlHttpRequest, textStatus, errorThrown) {
            // Handle Errors
        }
    });
}
function ThirdFunction() {
    // Do more stuff
}

Answer 2

事实证明，问题出在创建简化版本时删除的部分，我包含在原始问题中。

$.ajax 调用的完成方式没有错。

问题出在第二功能上。那里的 ajax 调用是在循环中完成的，该循环正在经历一次额外的迭代，导致 javascript 在它之后停止处理任何内容。

function SecondFunction() { 
    for (var i = 0; i < myArray.length; i++) { // < was <= causing the loop to iterate one extra time
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            datatype: "json",
            data: myData,
            url: myUrl,
            async: false,
            beforeSend: function (XMLHttpRequest) {
                XMLHttpRequest.setRequestHeader("Accept", "application/json");
                XMLHttpRequest.setRequestHeader("X-HTTP-Method", "MERGE");
            },
            success: function (data, textStatus, XmlHttpRequest) {
                console.log("Stuff happened");
            },
            error: function (XmlHttpRequest, textStatus, errorThrown) {
                // Handle Errors
            }
        });
    }
}

再次感谢您的帮助，并为误导性问题感到抱歉。