Jquery解析JSON并延迟后追加答案

【问题标题】：Jquery parse JSON and append after delayJquery解析JSON并延迟后追加
【发布时间】：2011-04-25 20:11:49
【问题描述】：

我有以下代码：

function loadTweets() {
    $('#mainForm').submit(function(){
        return false;
     });  

    $('#send').click(function(){
                $('#tweets').html('');
                var searchTerm = $('#search').val();
                var baseUrl = "http://search.twitter.com/search.json?q=";
                $.getJSON(baseUrl + searchTerm + "&callback=?", function(data) {
                console.log(data);
                $.each(data.results, function() {
                $('<div></div>')
                .hide()
                .append('<img src="' + this.profile_image_url + '" />')
                .append('<span><a href="http://www.twitter.com/'
                +
                this.from_user + '" target="_blank">' + this.from_user
                +
                '</a>&nbsp;' + this.text + '</span>')
                .appendTo('#tweets')
                .delay(800)
                .fadeIn();
                });
            }); 

    });
}
$(document).ready(function() {
   loadTweets();
});

代码工作正常，但我想附加到 div 'tweets'，来自 JSON 的数据，但不是一次全部，我想要一步一步，你能给我一个想法吗？最好的问候

【问题讨论】：

标签： jquery json append delay

【解决方案1】：

您可以根据索引添加更多延迟，如下所示：

$.each(data.results, function(i) {
  $('<div></div>').hide()
    .append('<img src="' + this.profile_image_url + '" />')
    .append('<span><a href="http://www.twitter.com/' +
             this.from_user + '" target="_blank">' + this.from_user +
             '</a>&nbsp;' + this.text + '</span>')
    .appendTo('#tweets')
    .delay(800 + 200 * i)
    .fadeIn();
});

.each() 回调的第一个参数是索引，基于0，因此在上面的代码中，第一条推文在 800 毫秒后淡入，接下来的 200 毫秒后，等等。只需根据需要微调数字。

【讨论】：