如何在循環和setInterval中執行fadein（）和fadeout（）ONLY ONCE？

Question

我正在製作一個更新的列表系統，每3秒檢查一次JSON文件中的新數據。另外，我添加了效果fadeIn（）和fadeOut（），但是在每次循環和（setInterval（list，3000）;）時，fadeIn（）和fadeOut（）都會執行 。 我想執行它，一旦數據已經附加。對不起，我的英語不好。

注意：它在閃爍。在3秒內

list(); 
setInterval(list, 3000); 

function list() { 
    $.getJSON('list.php',function(response){ 
     var timeout = 400; 
     $("#list").fadeOut(timeout); 
     $('#list').fadeIn(timeout); 
     $('#list').empty(); 

     for(var i = 0; i < response.list_count; i++){ 
      var newElement = document.createElement('div'); 
      newElement.innerHTML = response.list[i].firstname; 
      document.getElementById("list").appendChild(newElement); 
     } 
     document.getElementById("list_count").innerHTML = "" + response.list_count; + ""; 
    }); 
}; 

Answer 1

嘗試添加變量，如果你的元素顯示（如果元素已經表明只是爲了檢查）分配真實

var displayed = false; 

list(); 
setInterval(list, 3000); 

function list() { 
    $.getJSON('list.php',function(response){ 
     var timeout = 400; 
     if (displayed == false) { 
      $("#list").fadeOut(timeout); 
      $('#list').fadeIn(timeout); 
      displayed = true; 
     } 
     $('#list').empty(); 

     for(var i = 0; i < response.list_count; i++){ 
      var newElement = document.createElement('div'); 
      newElement.innerHTML = response.list[i].firstname; 
      document.getElementById("list").appendChild(newElement); 
     } 
     document.getElementById("list_count").innerHTML = "" + response.list_count; + ""; 
    }); 
};