setInterval(callback(),time)

最近在写一个需求的时候，出了点小小的问题，在这做个记录。

对于定时函数setInterval()大家应该都不陌生，setInterval(callback(),time)就是说设置一个定时器，每隔time时间，

（当然这个时间是以毫秒计算的，1秒=1000毫秒）执行一次回调callback()；

我刚开始这么写的代码：

function forbidden(){

          var time = ;

          $('.getSms').attr('disabled','disabled');

　　　　　　if(time>){

                var timer = setInterval(function(){

                    $('.getSms').text(time+'秒后重新发送');

                    time--;

　　　　　　　　　　　　};);

　　　　　　}else{

                window.clearInterval(timer);

                $('.getSms').text('发送短信');

                $('.getSms').attr('disabled',false);

          }

当时是这么想的，单击发送短信按钮触发forbidden()，初始化一个变量time=60，并且此时按钮不可用，然后判断：如果

time大于0，执行定时器timer（time--），等到time小于等于0的时候，清除定时器，按钮的显示文字也改变，并且变为可用，

好像一切都是这么地呵护逻辑，但是！！！点击按钮之后，看着上面的数字由60一点一点地减，减到0之后，变成了-1，-2...

瞬间懵逼了，于是就在else语句里面打一个console.log(time)，然后再跑一遍，等到数据为-1的时候，控制台没打印time值，

然后意识到，这个定时函数一直在跑，time=-1的时候，并没有进行判断，于是~~~~把time的判断放到callback()里面，像这样：

function forbidden(){

                var time = ;

                $('.getSms').attr('disabled','disabled');

                var timer = setInterval(function(){

                    $('.getSms').text(time+'秒后重新发送');

                    time--;

                    if(time<){

                        console.log(time);

                        window.clearInterval(timer);

                        $('.getSms').text('发送短信');

                        $('.getSms').attr('disabled',false);

                    }

                }, );

            }

然后，问题解决。

事后，觉得可以这么理解，定时函数是一个独立的空间，一旦开启，就一直执行（对后续代码段造成阻塞），然而我们在定时器后

面规定，time<0的时候，清除定时器，这句代码压根一直都没执行，又怎么会生效呢，放在callback()里面就不一样了，每隔1秒执行

一次callback()，每执行一次callback()就会判断了，time是不是小于0啊，不是的话待会还是要执行callback()，如果是的话，待会就

不执行这个callback()了。

巴特西

setInterval(callback(),time)

最新文章

热门文章