Question

我有以下代码：

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'推文'，来自JSON的数据但不是一次性的，我想一步一步，你能给我一个想法pls.Best问候

Answer 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毫秒后等等。只需微调数字根据需要。

Jquery解析JSON并在延迟后附加

1 个答案: