2 u013040249 u013040249 于 2016.03.29 15:41 提问

js setInterval在谷歌浏览器控制台能看到在运行 但是前台体现不出来

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);
    });

4个回答

danielinbiti
danielinbiti   Ds   Rxr 2016.03.29 15:54
已采纳

把setInterval换成setTimeout方式实现
估计可能原因是你这段代码3秒钟执行不完,导致一直在执行setIntervale中的方法,无法释放页面线程,没法刷新。

u013040249
u013040249 解决了 里面代码的问题 谢谢了
一年多之前 回复
danielinbiti
danielinbiti 回复u013040249: 如果有规律,单步调测一下就知道了,看有没有报错
一年多之前 回复
u013040249
u013040249 我给换成10秒也是4次就停了。而且inCount固定是7 3秒肯定能执行完
一年多之前 回复
showbo
showbo   Ds   Rxr 2016.03.29 16:36

console.log(newValue);这个有变没有?发html出来测试看看

runing22
runing22   2016.03.29 16:44

var inCount=$(".incount").size(); inCount是为4吗?

runing22
runing22   2016.03.29 16:45

var inCount=$(".incount").size(); inCount是为4吗?

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!