JQuery json boucle dans une boucle json confusion

Question

Je suis en boucle JSONP avec JQuery afin d'obtenir une liste de noms d'utilisateur. Je veux ensuite envoyer chaque nom d'utilisateur via l'API Twitter pour retourner une série de choses (nombre d'abonnés, etc.). Ensuite, affichez-le tous ensemble. Cela fait partie d'un «tableau de bord» beaucoup plus large basé sur des candidats politiques. Parce que le code que j'ai écrit est joli

Je suis capable d'importer et de boucler ce premier JSONP sans problème. Le problème vient quand je jette dans le truc Twitter: le code résultant charge effectivement toutes les informations des utilisateurs, mais le fait tout à la fois, en boucle et en remplaçant chaque ID jusqu'à ce qu'il atteigne le bas de la liste . C'est déroutant pour moi parce que cela se passe dans la boucle d'origine.

est ici une version simplifiée du code:

var URL = "biglist.json" 

$.getJSON(yqlURL, function(data) { 

$.each(data.query.results.row, function() { 

var name = this.col0 
var twitter = this.col5 

var li = $('<li>').html('<li>'+name+'<li>Twitter ID: @'+twitter+'<span class="tweetdisplay"></span>'); 

var followers="http://api.twitter.com/1/users/show.json?screen_name="+twitter+"&callback=?" 

$.getJSON(followers, function(tweets) { 

$('.tweetdisplay').html('<li>twitter followers: ' +tweets.followers_count); 

}); 

$('#result ul').append(li); 

}); 
}); 

Je suis assez sûr que je manque quelque chose de vraiment simple, mais je manque le plus certainement. Toute aide serait très appréciée.

Answer 1

Je suppose que le problème que vous rencontrez est dû au fait que l'appel interne $.getJSON() est asynchrone. Il déclenchera toutes les demandes sans attendre de réponse. Ensuite, chaque fois qu'il reçoit une réponse du serveur, il appelle votre code function(tweets) {.... Il n'y a aucune garantie que les réponses du serveur reviendront dans le même ordre que celui que vous leur avez envoyé, d'autant plus que votre boucle lancera à peu près toutes les requêtes simultanément. Afin de le faire fonctionner comme vous le souhaitez, vous devrez ajouter une sorte de vérification pour voir si le serveur a répondu à toutes vos demandes $.getJSON(followers ..., puis ajouter chacune à la liste <ul>. Laissez-moi un commentaire si vous avez besoin d'aide pour cela.

---

Mise à jour (2010-11-18): s'avère que je me suis trompé sur les problèmes que vous rencontrez. Je pense que vous avez peut-être confondu vos cours avec vos identifiants. Voici une version modifiée de votre code qui fonctionne:

$.each(data.query.results.row, function() { 
    var name = this.col0; 
    var twitter = this.col5; 

    var li = $('<li>').html('<ul><li>'+name+'</li>' 
       + '<li>Twitter ID: @' + twitter 
       + ' <span class="tweetdisplay"' 
       + 'id="' + twitter + '"></span></li></ul>' 
    ); 
    $('#result>ul').append(li); 

    var followers="http://api.twitter.com/1/users/show.json?screen_name="+twitter+"&callback=?" 
    $.getJSON(followers, function(tweets) { 
     $('#'+twitter).html('twitter followers: ' +tweets.followers_count); 
    }); 

});