为什么在附加json迭代的重复结果时,顺序会不断变化?

时间:2013-05-22 03:18:38

标签: jquery append

我首先获得视频的JSON播放列表。然后,我获取播放列表中提供的每个视频ID的JSON信息。从每个视频信息JSON我想在“#container”div中列出视频的缩略图网址。

我的问题是每次点击“获取JSON数据”按钮时缩略图的顺序都会改变。我查看了控制台,并且总是按照相同的顺序查询单个视频JSON,只是当我从该JSON发布信息时,它不是有序的。

是什么给出了?

$(document).ready(function(){
  $("button").click(function(){
    //$('p').remove();
        $.getJSON("https://api.dailymotion.com/playlist/xy4h8/videos",function(result){

            $.each(result.list, function (index, value) {
            //  console.log(value.id); 
                $.getJSON("https://api.dailymotion.com/video/"+value.id+"?fields=id,title,thumbnail_medium_url",function(resulted){
                    $("#container").append(resulted.thumbnail_medium_url + "<br />"); // THIS IS THE BIT ALWAYS OUT OF ORDER
                }); // use id of each object in list to get next json
            }); // for each of the list object within the playlist result obj

        }); // get playlist json
    }); // button click
});

感谢您的帮助。

2 个答案:

答案 0 :(得分:0)

因为在每个循环中你正在进行ajax调用。所以所有请求几乎同时进行。并且根据每个ajax调用值的响应时间,将值附加到容器上。因此,首先应该首先添加它的响应。这就是为什么订单总是不同的。

如果您希望每次都有相同的订单,请将所有ajax请求排队。这可以帮助您将所有ajax请求保留在队列中。请参阅第三个示例“排队类似Ajax调用” http://learn.jquery.com/effects/uses-of-queue-and-dequeue/

答案 1 :(得分:0)

$.getJSON()函数的$.ajax()函数为json,数据类型设置为jQuery.ajax()。如果你看一下just a shortcut的jQuery.ajax()函数,你会发现它默认设置为异步,这意味着它可能在任何时候发生,可能不是按指定的顺序。您可以通过async: falsedataType: 'json'直接{{1}}来解决问题。