在对每个条目执行请求时迭代数组

这是我的问题.我有一个数组,其中包含我需要查找天气的城市名称.所以我循环遍历每个城市并执行AJAX请求以检索天气.

var LOCATION = 'http://www.google.com/ig/api?weather=';

$( document ).ready( function() {
    for( var cityIdx = 0; cityIdx < cities.length; cityIdx++ ) {
        $.ajax({
            type: 'GET',
            url: LOCATION + cities[ cityIdx ],
            dataType: 'xml',
            success: function( xml ) {
                if( $( xml ).find( 'problem_cause' ) != 0 ) {
                    // Do what I want with the data returned
                    var weather = $( xml ).find( 'temp_c' ).attr( 'data' );
                }
            }
        });
    }
});

我遇到的问题是,在成功功能中,我无法访问城市名称(通过城市[cityIdx]).我在for循环和成功函数中插入了一个alert(),似乎循环执行cities.length次,然后我得到成功函数警报.我的目标是简单地遍历每个城市,获取天气并在我的页面上显示它以及相关的城市名称.

另外,您建议我将内容与演示文稿分开？

谢谢.:)

我怀疑你的问题类似于http://ejohn.org/apps/learn/上的例子.索引变量cityIdx在处理for循环时创建的闭包中更新,因此当运行成功函数时,cityIdx将指向数组中的最后一个元素.解决方案是使用评估的匿名函数来创建独立的上下文,其中索引值不会更新.

//...
success: (function(cities, idx) {
    return function( xml ) {
      if( $( xml ).find( 'problem_cause' ) != 0 ) {
        // Do what I want with the data returned
        // use cities[idx]
        var weather = $( xml ).find( 'temp_c' ).attr( 'data' );
      }
    };
  })(cities, cityIdx)
//...

由于Javascript使用函数进行闭包,我发现对我来说最简单的方法是将for循环的内容包装在内联函数中,该函数将当前城市名称复制到它始终可以访问的变量.

$(document).ready(function() {
    for (var cityIdx = 0; cityIdx < cities.length; cityIdx++) {
        new function() {
            var currentCity = cities[cityIdx];
            $.ajax({
                type: 'GET',
                url: LOCATION + currentCity,
                dataType: 'xml',
                success: function(xml) {
                    alert(currentCity);
                    if ($(xml).find('problem_cause') != 0) {
                        // Do what I want with the data returned
                        var weather = $(xml).find('temp_c').attr('data');
                    }
                }
            });
        }(); // the "();" calls the function we just created inline
    }
});