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 解决了 里面代码的问题 谢谢了
2 年多之前 回复
danielinbiti
danielinbiti 回复u013040249: 如果有规律,单步调测一下就知道了,看有没有报错
2 年多之前 回复
u013040249
u013040249 我给换成10秒也是4次就停了。而且inCount固定是7 3秒肯定能执行完
2 年多之前 回复
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币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
JS代码优化一:谷歌浏览器的timeline工具的使用
谷歌浏览器Timeline用法详解: 大家都知道,谷歌浏览器自带的相关工具是前端开发人员的利器。 点击F12会弹出一个界面,顶部带有功能的选项卡,其中有几个功能强大,但是相对较为复杂,比如Timeline,console和network。 (1).关于console的使用可以参阅谷歌控制台console相关命令介绍一章节。 (2).关于network的使用可以参阅谷歌浏览器network用
chrome浏览器控制台 console不打印信息问题解决办法。
最近换了个新电脑,安装chrome,想按F12调试下代码,发现控制台什么信息都没有。这就奇了怪了。 我还特地输入一段console.log('123');连这个都打印不出来。 后来依靠度娘,解决办法如下图 点击就会自动把勾勾上。 然后再去试试console.log('123'); 就神奇的打印出来了。 好吧,一点也不神奇.... END
浏览器调试js,但是在浏览器控制台找不到该js文件
在浏览器中,按如下操作进行 F12-Sources-ctrl+G
Chrome 控制台console的用法(js调试)
(js调试)
前台调试 js Console命令
Console命令详解,让调试js代码变得更简单 Firebug是网页开发的利器,能够极大地提升工作效率。 但是,它不太容易上手。我曾经翻译过一篇《Firebug入门指南》,介绍了一些基本用法。今天,继续介绍它的高级用法。 =================================== Firebug控制台详解 作者:阮一峰 出处:http://www.
VMware虚拟机启动后出现黑屏,不能显示界面,但是在查看->控制台视图下可以看到界面
在网上找到一种解决方法,实测可以解决问题:以管理员身份运行cmd控制台程序,输入命令netsh winsock reset,作用是重置winsock网络规范,然后重启系统,在打开VMware就可以了。 如果有网友试过这种方法不行,但是找到其他解决方法,也可以分享出来!
js浏览器控制台不报错,但不运行下面的js代码
今天在写代码是碰到一个很奇葩的错误,在控制台不报错,但下面的js代码就是不执行,我就把下面的js代码放到最上面,可以执行,在这样一步一步往下放,最终找到了一段不是方法的js代码它就是一个js判断,但我在这个判断里面有return false,所以他下面的代码就不执行了,原来他已经跳出了整段js代码,这是一个不经意犯得小错误。解决办法就是如果这个return 没什么用就删了,有用就放到最下面的js代
setTimeout与setInterval在不同浏览器下的差异
setTimeout与setInterval是window对象的两个非常神奇方法,用于实现定时或延时调用一个函数或一段代码。(新手可能认为setTimeout与setInterval是javascript函数,这是错误的。新手容易将javascript对象函数与DOM对象方法混淆。) 先来一段代码,大家猜猜在各种浏览器下的结果会是怎么样的呢?function f(){    var s =
js停止setInterval函数的运行
在某些情况下,我们需要用到setInterval函数,让某方法在每隔固定时间段后自动执行。 可满足某些条件后我们需要将其终止,不再运行,做法如下: Auto=window.setInterval("InsertAutoPage();",1000); 这里要注意"Auto"是给该setInterval函数的命名,之后要通过这个来终止。 clearInterval(Auto); 括号里
setInterval设置停止的次数和时间
需要知道已经经过了多少次或者说过多久就会停止 var timesRun = 0; var interval = setInterval(function(){ timesRun += 1; if(timesRun === 60){ clearInterval(interval); } //do whatever here.. }, 2000); var startTime = new Date