使用JQuery，如何在继续之前等待AJAX​​调用及其回调完成？

Question

我的问题与this one类似，但我无法通过这些答案解决问题。

简而言之，在页面加载时，ajax调用会生成一个下拉选择元素，然后根据某些参数设置其默认值。
代码如下：

getList('country', null, q, 'category:customer', null);  
newReportSelection.apply($("#report"));  

function getList(field, val, q, fq, default_value) {
    $.get(... {  
      // call info
    },  function(result) {
      // appending the dropdown to DOM
    });
};

newReportSelection = function () {
    // determine and select default option
}  

getList用于各个地方，因此我无法将此（特定于页面加载）newReportSelection（）代码添加到ajax回调函数中。
在getList（）调用周围设置一个promise并不等待Ajax调用，因为它是异步的。
在Ajax调用周围放置一个等待它被发送，但不是为了执行回调函数 把一个放在回调函数周围也不起作用，因为Ajax部分等待它，但是由于异步性，getList（）继续运行。

即使在Ajax调用上链接promises并且回调函数工作，这看起来像是一个非常脏的解决方法而且不受欢迎。
有没有办法让newReportSelection（）调用等待整个getList（）完成，而无需手动设置对async: false的Ajax调用？

提前致谢。

Answer 1

从$ .get

返回延期/承诺

function getList(field, val, q, fq, default_value) {
  return $.get(... {  
    // call info
  },  function(result) {
    // appending the dropdown to DOM
  });
};     

然后您可以使用promise .done()方法调用您的后续跟踪：

getList('country', null, q, 'category:customer', null).done(function() {
    newReportSelection.apply($("#report")); 
});

Answer 2

var d1 = $.Deferred();
var d2 = $.Deferred();
var d3 = $.Deferred();

$.when( d1, d2, d3 ).done(function ( v1, v2, v3 ) {
  console.log( v1 ); // v1 is undefined
  console.log( v2 ); // v2 is "abc"
  console.log( v3 ); // v3 is an array [ 1, 2, 3, 4, 5 ]
});

d1.resolve();
d2.resolve( "abc" );
d3.resolve( 1, 2, 3, 4, 5 );

摘自https://api.jquery.com/jquery.when/