setInterval(callback(),time)

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

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

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

我刚开始这么写的代码：

function forbidden(){var time = 60;$('.getSms').attr('disabled','disabled');if(time>0){var timer = setInterval(function(){$('.getSms').text(time+'秒后重新发送');time--;};1000);}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 = 60;$('.getSms').attr('disabled','disabled');var timer = setInterval(function(){$('.getSms').text(time+'秒后重新发送');time--;if(time<0){console.log(time);window.clearInterval(timer);  $('.getSms').text('发送短信');$('.getSms').attr('disabled',false);}}, 1000);}

然后，问题解决。

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

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

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

不执行这个callback()了。

转载于:https://www.cnblogs.com/eco-just/p/9160817.html

setInterval(callback(),time)相关推荐

setTimeout和setInterval区别，以及定时器的传参功能
setTimeout和setInterval都属性Javascript中的定时器,可以规定延迟时间再执行某个操作,不同的是setTimeout在规定时间后执行完某个操作就停止了,而setInterva ...
【JavaScript总结】JavaScript语法基础：BOM
DOM是文档对象模型,操作对象是文档 window.document,和浏览器没有直接关系 DOM常用事件: onload,onbeforeunload, onunload onclick,ondbl ...
JavaScript 慢慢移动的海绵宝宝
前情提要:Javascript 移动的海绵宝宝这个海绵宝宝是匀速运动.突然停下来的,有点不合理.现实中我们跑步都是速度慢慢减小到0. 要实现这个效果,就必须速度逐渐减小,本质上是盒子的步长逐渐减小. ...
Javascript 移动的海绵宝宝
效果描述: 做一个简单的动画效果,刚刷新页面时,SpongeBob在页面的左上角位置,随着时间推移,他匀速向右移动,直到右侧抵达页面右侧停下来. 分析: SpongeBob作为一张图片被存放在< ...
JS定时器和单线程异步特性
首先要说的是,定时器相关的方法都是属于BOM方法,而定时器呢,它是用于在设定的时间执行一段代码,或者在给定的时间间隔内重复该代码.具体函数: setTimeout(callback, delay); ...
java使用ajax异步刷新_Jquery的Ajax实现异步刷新
在Jquery中提供了一套ajax的方法,有: $.ajax([data],fn) load(url, [data], [callback]) $.get(url, [data], [callback ...
（七）JS基础知识四（搞定异步）【三座大山之三，必考！！！】
JS基础知识四(异步) 提问单线程应用场景 callback hell和promise 提问同步和异步的区别是什么手写用Promise加载一张图片前端使用的异步的场景有哪些单线程 JS是单 ...
Flash 检测摄像头是否被占用
在FMS编程中,我们经常在使用摄像头前,要进行摄像头的检测,检测是否有摄像头或摄像头是否可用.通常地,我们通过这种方式检测摄像头是否繁忙: var temp_cam = Camera.get(); i ...
你应该知道的 Node 基础知识
大家好,我是若川.最近组织了源码共读活动,感兴趣的可以加我微信 ruochuan12 参与,已进行两个多月,大家一起交流学习,共同进步.源码共读学的多数是 Node.js ,今天分享一篇 Node.j ...

setInterval(callback(),time)

setInterval(callback(),time)相关推荐

最新文章

热门文章