Question

这是我的代码的要点：https://gist.github.com/tconroy/e52e0e7402face8f048e

基本上，我的程序分为几个步骤：

从N个输入中检索用户输入（用户可以添加/删除）
对每个输入执行AJAX查询，检索每个输入的JSON格式的天气数据。
成功完成AJAX后，将数据传递给dataReady()函数。
dataReady()函数将数据存储到全局Array[]

问题是AJAX数据没有存储在全局数组中。如何保存JSON响应以便稍后在程序中使用？我需要将所有天气数据存储在一个数组中，因此我可以在程序中稍后对其进行迭代以创建我的图形。

导致问题的部分：

function getWeatherData(){
  // set up query strings.
  var queryBase  = "http://api.worldweatheronline.com/free/v1/weather.ashx?q=",
      queryEnd   = "&format=json&num_of_days=5&key="+weatherAPIKey;

  // iterate through each address input
  $('.inp').each(function(){
    // setup query
    var inp   = this;
    var addr  = encodeURIComponent( inp.value );
    var query = queryBase + addr + queryEnd;
    // perform query
    $.ajax({
      url: query,
      async: false,
      dataType: 'jsonp',
      success: function(json){
        // format our response data into object, push it into container array.
        var objName = String(decodeURIComponent(addr));
        var objVals = json.data.weather;
        dataReady(objName, objVals);
      },
      error: function(){
        alert(errMsg);
      }
    });
  }); // end $('.inp').each();
  // setup the graph
  setupGraph();
} // end getWeatherData();


function dataReady(objName, objVals) {
  console.log('dataReady() called.');
  responseValues[objName] = objVals;
}

Answer 1

根据我的理解（参见注释），您正在处理异步调用的典型问题。你调用AJAX，然后调用setupGraph()但是ajax响应将在该调用之后到达，因为它是异步的。

首先，做async: false是坏事，错事和所有邪恶的根源。永远不要使用它。在你的情况下，它甚至不会工作，因为你不能强迫JSONP同步。但即使你可以让我重复我的自我，因为这很重要：不要使用async: false 。

现在回到你的问题。你应该使用延迟回调代替：

var reqs = [];
$('.inp').each(function(){
    // some code
    reqs.push(
        $.ajax({
            // some settings
        })
    );
});

$.when.apply($, reqs).then(function() {
    setupGraph();
});

在此处详细了解$.when：https://api.jquery.com/jQuery.when/

将AJAX响应存储到变量中以便稍后在脚本中使用？

1 个答案: