阵列中的Ajax调用

我有下面一段代码，从IMDB得到的数据：阵列中的Ajax调用

for(var i in titles) 
{ 
    $.ajax({ 
     url: "http://www.imdbapi.com/?t=" + titles[i], 
     dataType: 'jsonp', 
     success: function(data) { 

     $('body').append('"'+titles[i]+'",'); 
     $.each(data, function(key, val) { 
      $('body').append('"'+val+'",'); 
     }); 
     $('body').append('<br>'); 
     window.setTimeout(null, 1000); 
     } 
    }); 
}

的代码工作正常，除了$('body').append('"'+titles[i]+'",');其送花儿给人返回相同的标题。

来源

2011-06-08 Manu

标题[I]总是返回相同的标题 – Manu 2011-06-08 10:20:34

重复自己显然没有帮助解决。 – 2011-06-08 10:24:31

我澄清了最后一行。 – Manu 2011-06-08 11:01:35

该循环在调用任何成功处理程序之前完全执行，所以当您进入成功处理程序时，“我”将成为最后一个标题。

你需要像

function makeSuccessHandler(titles, i) { 
    return function (data) { 
     $('body').append('"'+titles[i]+'",'); 
     $.each(data, function(key, val) { 
      $('body').append('"'+val+'",'); 
     }); 
     $('body').append('<br>'); 
     window.setTimeout(null, 1000); 
    } 
} 

for(var i = 0; i < titles.length; i++) 
{ 
    $.ajax({ 
     url: "http://www.imdbapi.com/?t=" + titles[i], 
     dataType: 'jsonp', 
     success: makeSuccessHandler(titles, i) 
    }); 
}

来源

2011-06-08 10:21:02 Bemmu

的success功能是异步的（它需要等待IMDB响应），因此会一直运行后整个循环结束 - 所以i，该函数内，将永远是最后i。

来解决这个最简单的方法是利用jQuery的each功能：

$.each(titles, function (i, value) { 
    $.ajax({ 
     success: function (data) { 
      // as usual... 
     } 
    }); 
});

这工作，因为函数保留它自己的范围（因此它的i自己的副本）。

来源

2011-06-08 10:18:36

+1 - 我认为这比在块之外具有处理函数更优雅。 – 2011-06-08 10:31:59

你不能那样做，Ajax调用将执行异步的。当您的成功方法执行时，您的索引变量的值将不正确。你可以修复它，如果你从你的成功方法增加我，并且corcor不做一个for循环

来源

2011-06-08 10:22:15 Anders

问题是，如果你在一个循环中调用一个异步函数，它将使用最后分配的封闭变量的值。

这可以通过使用currying

function appendTitle(var title) 
{ 
    return function(var data) { 
     $('body').append('"'+title+'",'); 
     $.each(data, function(key, val) { 
      $('body').append('"'+val+'",'); 
     }); 
     $('body').append('<br>'); 
     window.setTimeout(null, 1000); 
    } 
} 


for(var i in titles) 
{ 
    $.ajax({ 
     url: "http://www.imdbapi.com/?t=" + titles[i], 
     dataType: 'jsonp', 
     success: appendTitle(titles[i]) 
    }); 
}

来源

2011-06-08 10:26:24

阵列中的Ajax调用

回答

相关问题