Question

我通过循环运行几次对Instagram API的调用，但它产生了我无法理解的奇怪结果。

for(var i = 0; i < tags.length; i++){

    document.write('search: ' + i + 'round');
    document.write(tags[i] + ' ');
    document.write('<hr />');
    var url = 'https://api.instagram.com/v1/tags/'+ tags[i] +'/media/recent?&client_id=5a7b13571ced47418dd539e6fc97a67f&count='+count+'&callback=?';

    $.getJSON(url, function(data) {
        console.log(data.data.length);

        if(data.data.length === 0){
            //$('ul.images').append('<li>No results</li>');

        } else {

            $.each(data.data, function(index, value){
            //console.log(value);
                var imgUrl = value.images.low_resolution.url,
                imgUser = value.user.username,
                imgLink = value.link;
                it.push(imgLink);

                document.write(value.link + '<br />');
                //$('ul.images').append('<li><a href="'+imgLink+'" target="_blank"><img src="'+imgUrl+'"/></a></li>');
            });
        }
        document.write('---------------------'  + '<br />');
    });
}

当我搜索三个标签，猫，狗，猪时，结果是：

search: 0roundcat
search: 1rounddog
search: 2roundpig

5 instagram image links
---------------------

5 instagram image links
---------------------

5 instagram image links
---------------------

所以它似乎首先循环了三个document.write()语句，然后进入$.getJSON()语句。

有什么想法吗？

Answer 1

如果你的问题是为什么“i + round + tag”输出出现在带有链接的输出之前，那是因为getJSON() 异步，即它启动一个请求，立即返回。然后，在for循环完成后，执行已返回到事件循环，并且异步请求的结果已到达，它们按照它们到达的顺序打印。

有几种解决方法，一种是这样的：

var tags = ['cat','dog','pig'];
function start_next_request() {
  var tag = tags.shift();
  var url = ...
  $.getJSON(url, function (data) {
    ...
    start_next_request();
  }
}
start_next_request();

将$ .getJSON（url，function（data）放在循环中但产生错误的结果

1 个答案: