Php 多个异步ajax调用jquery

我正在开发一个PHP应用程序，它使用ajax在页面中加载组件。更重要的是，假设这些模块/组件按顺序加载，这样，如果前一个加载失败，后面的加载也会失败

换句话说，页面加载、进行ajax调用并接收json编码的响应。如果响应为“SUCCESS”，它将进行第二次调用并接收另一个json响应。同样，如果第二个响应是“成功”，它将发出第三个呼叫，依此类推。假设这种情况发生大约8次，此时页面被认为已完全加载

如果在此加载过程中，假设第三个请求收到响应“FAIL”，则来自4-8的请求将被放弃，并抛出一条错误消息

我现在实现这一点的方法是打第一个电话，等待响应，然后在第一个电话中打第二个电话

为了便于参考，以下是代码的一部分：

$.get(WEB_ROOT+'/process/createKeywords', {}, function(keywordsResponse) {
    $('#createKeywords').parent().children(0).children(0).hide();
    if (keywordsResponse.RESPONSE == "SUCCESS") {
        $('#createKeywords').html(img);
        $('#getTraffic').parent().children(0).children(0).show();

        $.get(WEB_ROOT+'/process/getTraffic', {}, function(trafficResponse) {
            $('#getTraffic').parent().children(0).children(0).hide();
            if (trafficResponse.RESPONSE == "SUCCESS") {
                $('#getTraffic').html(img);
                $('#getGoogleResults').parent().children(0).children(0).show();

                $.get(WEB_ROOT+'/process/getGoogleResults', {}, function(googleScrapeResponse) {
                    $('#getGoogleResults').parent().children(0).children(0).hide();
                    if (googleScrapeResponse.RESPONSE == "SUCCESS") {
                        $('#getGoogleResults').html(img);
                        $('#resortResults').parent().children(0).children(0).show();

你可以想象，这会很快变得复杂和丑陋。有人对我如何完成这样的工作有什么建议吗

//setup an object to store the necessary info for each AJAX call
var setup = [
    {
        url      : WEB_ROOT + '/process/createKeywords',

        //the callback will be run before the next AJAX request is made
        callback : function (keywordsResponse) {
            $('#createKeywords').parent().children(0).children(0).hide();
            if (keywordsResponse.RESPONSE == "SUCCESS") {
                $('#createKeywords').html(img);
                $('#getTraffic').parent().children(0).children(0).show();
            }
        }
    },
    {
        url      : WEB_ROOT + '/process/getTraffic',
        callback : function () {
            $('#getTraffic').parent().children(0).children(0).hide();
            if (trafficResponse.RESPONSE == "SUCCESS") {
                $('#getTraffic').html(img);
                $('#getGoogleResults').parent().children(0).children(0).show();
            }
        }
    }
];

//setup a function that recursively calls itself when the current AJAX request comes back successfully
function doAJAX(index) {
    var val = setup[index];
    $.getJSON(val.url, function (serverResponse) {

        //run the specified callback for this AJAX request
        val.callback(serverResponse);

        //now check if the response is "SUCCESS" and make sure that another AJAX request exists in the `setup` object
        if (serverResponse.RESPONSE == 'SUCCESS' && typeof setup[(index + 1)] != 'undefined') {

            //since the last AJAX request was a success and there is another one set, run it now
            doAJAX(index + 1);
        }
    });
}

//run the first AJAX request by passing in zero (index)
doAJAX(0);

---

这只允许您为连续的AJAX请求设置必要的变量。与每个

url

关联的

回调将在下一个AJAX请求运行之前运行。
您可能需要考虑将其设置为操作对象的集合。每个对象都有一个URL、一个预操作、一个后操作和一个成功操作。设计一个函数，它弹出第一个动作，执行它的预动作，然后执行AJAX调用。AJAX调用返回后，它执行post操作，检查是否成功，如果成功，则执行success操作，并使用剩余的任务调用自己。这样的系统将非常灵活，可以适应任意数量的任务。
您能将所有逻辑组合到一个AJAX调用中吗？不幸的是，不能。每个逻辑都依赖于前一步的完成。换句话说，getTraffic不能在没有createKeywords的情况下运行，getGoogleResults不能在没有getGoogleResults的情况下运行，等等。在我看来，在后续的请求（空的
{}
对象和静态url）中，您似乎没有使用javascript中的任何数据，这让我相信，所需的数据存储在会话中。如果您对实现这种链接机制很感兴趣，请查看这一点。感谢您花时间编写实际函数。谢谢。