如何在循环和setInterval中执行fadein()和fadeout()ONLY ONCE?
问题描述:
我正在制作一个更新的列表系统,每3秒检查一次JSON文件中的新数据。另外,我添加了效果fadeIn()和fadeOut(),但是在每次循环和(setInterval(list,3000);)时,fadeIn()和fadeOut()都会执行 。 我想执行它,一旦数据已经附加。对不起,我的英语不好。如何在循环和setInterval中执行fadein()和fadeout()ONLY ONCE?
注意:它在闪烁。在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; + "";
});
};
答
尝试添加变量,如果你的元素显示(如果元素已经表明只是为了检查)分配真实
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; + "";
});
};