Ajax 成功函数

Ajax success function

本文关键字:函数 成功 Ajax      更新时间:2023-09-26

我有一个执行以下代码的ajax成功函数:

success: function(json) {
  for (var i = 0; i < json.album.tracks.length; i++) {
      audio.push(json.album.tracks[i].url);
      var new_li = $('<li class="spacer" data-id="' + json.album.tracks[i].id + '">' + json.album.tracks[i].title + '</li>').hide();
      $('.playlistSongs').append( $(new_li).fadeIn(1000)); //1000 is just for testing    
  }
}

这行得通!问题是它不像我想要的那样工作。我希望每首曲目在播放列表div 中一次淡入一个。但是,所有轨道都一起淡入。我尝试在不同的地方添加 .delay(),但没有区别。

我的问题是,我需要做什么才能让每个轨道一次淡入一个而不是全部淡入?我还尝试将代码移动到成功回调之外,但仍然不起作用。

谢谢。

而不是

 $('.playlistSongs').append( $(new_li).fadeIn(1000)); 

尝试

$('.playlistSongs').append(new_li).fadeIn(); 

试试这个:

  var lis = ""
  for (var i = 0; i < json.album.tracks.length; i++) {
      audio.push(json.album.tracks[i].url);
      lis += '<li class="spacer" data-id="' + json.album.tracks[i].id + '">' + json.album.tracks[i].title + '</li>';
  }
  $(lis)
        .hide()
        .appendTo('.playlistSongs')
        .each(function(index) {
            // For each li, wait some time and fadeIn. The first one will not have a delay
            $(this).delay(400*index).fadeIn(300);
        });