Javascript jQuery等待Ajax调用获得数据后再显示

我有一个Jquery Ajax脚本，看起来像这样

/* Get Values */
function get_values(id){

    var settings = {
        "async": true,
        "crossDomain": true,
        "url": "example.com",
        "method": "GET",
        "headers": {
        "Accept": "application/json",
    },

    "dataType"   : "json",
    "mimeType": "multipart/form-data",
    }

    $.ajax(settings).done(function (response) {
        window[data_ ' + id] = response;    
    });

}


get_values(1);
get_values(2);
get_values(3);

$(".content_loader").fadeOut( function() {
    $(".main_container").html('<div class="results">' + data_1 + data_2 + data_3 +'</div>');
});

/*获取值*/
函数get_值（id）{
变量设置={
“异步”：true，
“跨域”：正确，
“url”：“example.com”，
“方法”：“获取”，
“标题”：{
“接受”：“应用程序/json”，
},
“数据类型”：“json”，
“mimeType”：“多部分/表单数据”，
}
$.ajax（设置）.done（函数（响应）{
窗口[数据+id]=响应；
});
}
获取_值（1）；
获取_值（2）；
获取_值（3）；
$（“.content_loader”）.fadeOut（函数（）{
$（“.main_container”）.html（“”+data_1+data_2+data_3+“”）；
});

它正确地从Ajax调用中获取数据并将其保存到3个变量中

• 数据1
• 数据2
• 数据表3

然后淡出微调器动画，并淡出显示结果的HTML

我正在尝试设置一些东西，以便微调器和内容只有在成功获取Ajax调用的结果后才会消失

---

这是回调的工作还是类似的工作？

我认为，您需要等待所有ajax请求完成。下面是等待所有ajax请求完成的方法

function get_values(id) {
   var settings = {
        "async": true,
        "crossDomain": true,
        "url": "example.com",
        "method": "GET",
        "headers": {
        "Accept": "application/json",
    },

    "dataType"   : "json",
    "mimeType": "multipart/form-data",
    };

    return $.ajax(settings);
};

$.when(get_values(1), get_values(2), get_values(3)).done(function(r1, r2, r3){
        window['data_1'] = r1;
        window['data_2'] = r2;
        window['data_3'] = r3;

        $(".content_loader").fadeOut( function() {
            $(".main_container").html('<div class="results">' + data_1 + data_2 + data_3 +'</div>');
        });
    });

函数获取值（id）{
变量设置={
“异步”：true，
“跨域”：正确，
“url”：“example.com”，
“方法”：“获取”，
“标题”：{
“接受”：“应用程序/json”，
},
“数据类型”：“json”，
“mimeType”：“多部分/表单数据”，
};
返回$.ajax（设置）；
};
$.when（获取_值（1）、获取_值（2）、获取_值（3））.done（函数（r1、r2、r3）{
窗口['data_1']=r1；
窗口['data_2']=r2；
窗口['data_3']=r3；
$（“.content_loader”）.fadeOut（函数（）{
$（“.main_container”）.html（“”+data_1+data_2+data_3+“”）；
});
});

从

get_values（）

返回

$.ajax

承诺，并用于在所有请求完成后运行

/* Get Values */
function get_values(id) {

  var settings = {
    "async": true,
    "crossDomain": true,
    "url": "example.com",
    "method": "GET",
    "headers": {
      "Accept": "application/json",
    },

    "dataType": "json",
    "mimeType": "multipart/form-data",
  }

  return $.ajax(settings)

}


var req1 = get_values(1),
  req2 = get_values(2),
  req3 = get_values(3);


$.when(req1, req2, req3).done(function(data_1, data_2, data_3) {
  $(".content_loader").fadeOut(function() {
    $(".main_container").html('<div class="results">' + data_1 + data_2 + data_3 + '</div>');
  });

})

/*获取值*/
函数get_值（id）{
变量设置={
“异步”：true，
“跨域”：正确，
“url”：“example.com”，
“方法”：“获取”，
“标题”：{
“接受”：“应用程序/json”，
},
“数据类型”：“json”，
“mimeType”：“多部分/表单数据”，
}
返回$.ajax（设置）
}
var req1=获取_值（1），
req2=获取_值（2），
req3=获取_值（3）；
$.when（请求1、请求2、请求3）.done（函数（数据\u 1、数据\u 2、数据\u 3）{
$（“.content_loader”）.fadeOut（函数（）{
$（“.main_container”）.html（“”+data_1+data_2+data_3+“”）；
});
})

IMHO一个全局变量是不好的。 您可以在ajax完成后传递结果

function getValues(id){

var settings = {
    ...
}

$.ajax(settings).done(function (response) {
    $(".results").html(response)   
}).fail(function(console.log(arguments)));

---

我猜您正在ajax请求中寻找

success:function（）

？