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

storing AJAX response into variable for use later in script?

本文关键字:脚本 响应 AJAX 存储 变量      更新时间:2023-09-26

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

基本上,我的程序分为几个步骤:

  1. 从N个输入中检索用户输入(用户可以添加/删除)
  2. 对每个输入执行AJAX查询,检索JSON格式的天气数据。
  3. AJAX成功后,将数据传递给dataReady()函数。
  4. 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;
}

据我所知(见注释),您正在处理异步调用的典型问题。您调用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/