无法在jQuery中正确使用ajax循环

问题描述：

我总是从json文件中获取最后一个值，然后每5秒钟就会消失一次。我该怎么做，因此json中的每个值都会出现并消失？ :(无法在jQuery中正确使用ajax循环

$.ajax({ 
     type:'GET', 
     url: root + '/posts/1/comments' 
      }).then(function(data){  
      $.each(data,function(i, content) { 
      $('#news').html('<h3>'+ content.name + '</h3><p>' + content.name +'</p>) 
         .fadeIn().delay(5000).fadeOut('slow'); 
       });      
      }); 
});

追加到'$（'＃news'）'而不是覆盖内容？ https://api.jquery.com/append/ –

但我想覆盖它 – mrnvdvmv

你可能想重新使用setTimeout（）而不是delay（），它更灵活。 –

答

林假设你正在试图#news每5秒显示新内容时，当您使用delay(5000)它不等待最后延迟事件引发序列中的下一个之前完成。

而是尝试保存由AJAX返回数组中的数据，并创建一个功能，通过这个数组进行迭代。使用JavaScript的setTimeout直到用完新闻项目上发射新的功能，每5秒钟。

var news, 
    newsCount, 
    i; 

function updateNews(){ 
    if (i < newsCount) { 
     // add news[i] to your HTML here // 
     i++; 

     setTimeout(function(){ 
      updateNews(); 
     },5000); 
    } 
} 

$.ajax({ 
    type: 'GET', 
    url: root + '/posts/1/comments' 
}).then(function(data) { 
    news = data; 
    newsCount = news.length; 
    i = 0; 
    updateNews(); 
});

您可能想传递消息并将updateNews作为参数传递，因为书面updateNews无法访问回调的范围。否则看起来不错。 –

@jeffcarey是的，这是正确的，谢谢。我已编辑并将变量拉出到全局范围。 –

然后，您需要将ajax响应中的“i”重置为0，否则，如果ajax调用不止一次，它将成为上次停止的地方... –

无法在jQuery中正确使用ajax循环

相关推荐