js setInterval在谷歌浏覽器控制台能看到在運行 但是前台體現不出來
點完trybtn後,前台頁面裡的進度條和值都正常累加 但是走4次之後,後台可以看到setInterval一直在運行 這裡我用的是thecount 一直累加可以看到。但是前台頁面上的值就不動了。在網上差很長時間也沒找到,求大神指教啊。
$("#trybtn").click(function () {
var thecount=0;
var inCount=$(".incount").size();
var steptime=1000*3;
var myVar=setInterval(function(){
for(var i=0;i<inCount;i++){
//獲取進度條寬度百分比
var a=0,b=0,c=0,d=0,e=0,newValue=0;
a=parseInt($(".progress-bar"+i).css("width"));
b=parseInt($(".progress"+i).css("width"));
c= parseInt(a/b*100);
//獲取每次步進值
var allowtime=parseInt($(".theTime"+i).text());
var stepValue=parseInt(100/(allowtime*60*1000/steptime));
newValue=c+stepValue+1;
console.log(newValue);
if(newValue>60&&newValue<100){
$(".progress-bar" + i).attr("class", "progress-bar progress-bar"+i+" progress-bar-warning");
}
if(newValue>30&&newValue<60){
$(".progress-bar" + i).attr("class", "progress-bar progress-bar"+i+" progress-bar-success");
}
if(newValue>=100) {//完成標記
$(".progress-bar" + i).css("width", "100%");
$(".theTag" + i).text("100%");
$(".progress-bar" + i).attr("class", "progress-bar progress-bar"+i+" progress-bar-danger");
$(".trData"+i).fadeOut(3000);
$(".trData"+i).css('background-color','red');
}
else{
$(".progress-bar" + i).css("width", newValue+"%");
$(".theTag" + i).text(newValue+"%");
}
}
thecount++;
console.log("執行了:"+thecount);
console.log("----------------------------------");
},steptime);
});
把setInterval換成setTimeout方式實現
估計可能原因是你這段代碼3秒鐘執行不完,導致一直在執行setIntervale中的方法,無法釋放頁面線程,沒法刷新。