如何在循环中生成多个ajax请求按顺序返回值?

我必须在循环上发出一系列Ajax请求。 大约100个。 每个请求都返回一个JSONP变量。 我从JSON中提取数据并继续将值附加到div中。 问题是我希望div按函数调用的顺序附加数据。 即顺序。 现在每次刷新页面时都会得到不同的顺序,具体取决于请求的完成顺序。 这是我的代码。

$.each(elem, function (index, item) { $.ajax({ type: 'post' , url: moviesSearchUrl + '&q=' + encodeURI(item) + '&page_limit=1', dataType: "jsonp", async: false, success: searchCallback }); function searchCallback(data) { var movies = data.movies; var markup = index + ': '+ movies[0].title + '
'; $("div.content").append(markup); } }); });

因为我在div中显示索引的值,每次我得到随机订单。 有时为2 4 3 1 7,有时为1 5 2 7 4。 我甚至尝试异步:false。 这没有帮助。 我在某处读到JSONP无法使用async:false。 请帮帮我。

你可以使用占位符。

  $.each(elem, function (index, item) { var $placeholder = $('
').appendTo("div.content"); $.ajax({ type: 'post' , url: moviesSearchUrl + '&q=' + encodeURI(item) + '&page_limit=1', dataType: "jsonp", async: false, success: searchCallback }); function searchCallback(data) { var movies = data.movies; var markup = index + ': '+ movies[0].title + '
'; $placeholder.replaceWith(markup); } }); });

不要使用for循环。 使用递归函数:

 var i = 1; function loadNext(){ if (i < 5){ $.ajax({ type: "GET", url: "results/result_html.php?usn="+i+"&resultType="+resultType, dataType:"JSON", success:function(result){ finalResult+=result; result=result+htmlMessage; $("#info").hide(); $("#result").html(result); $("#usn").attr("placeholder", "Class USN"); loadNext(); } }); i++; } } 

就像是:

 // iterate over your set $.each(myset, function(i,e){ // placeholder div (hidden from view until it's populated) var $placeholder = $('
').hide().appendTo('div.content'); // make your ajax call $.getJSON('/link/to/resource','{date:here}',function(d){ // insert the content in to the div and re-show it $placeholder.text(i + ': ' + d.movies[0].title).show(); }); });