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

对于定时函数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)的更多相关文章

  1. Node.js中setTimeout和setInterval的使用

    Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...

  2. JavaScript之setInterval() 函数

    定义和用法 setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被 ...

  3. Flex(flash)检测摄像头的3种状态(是否被占用,没安装摄像头,正常)

    在视频程序的编写过程中,我们经常要使用摄像头,在使用摄像头前有必要对摄像头的现有状态做个检测: 1.被占用 2.没安装摄像头 3.正常 camera=Camera.getCamera();       ...

  4. commonJS — DOM操作(for DOM)

    for DOM github: https://github.com/laixiangran/commonJS/blob/master/src/forDOM.js 代码 /** * Created b ...

  5. Web 前端 —— javaScript

    目录: 资源链接 基础知识 基础问题集 资源链接: http://www.w3school.com.cn/ 弹出窗口,变暗特效:http://www.csrcode.cn/article-584-1. ...

  6. 读书笔记: nodejs API 参考

    >> bufferBuffer对象是全局对象Buffer支持的编码方式:ascii, utf8, base64, binarynew Buffer(size)new Buffer(arra ...

  7. JavaScript实现动画效果

    说到JavaScript实现动画效果,不得不想到两个函数,setTimeout和setInterval. setTimeout的常用的使用方法为 setTimeout(callback, delay) ...

  8. Node.js学习笔记(四): 全局对象

    在浏览器 JavaScript 中,通常 window 是全局对象, 而 Node.js 中的全局对象是 global,所有全局变量(除了 global 本身以外)都是 global 对象的属性. 这 ...

  9. JavaScript 知识点

    JS基础 页面由三部分组成: html:超文本标记语言,负责页面结构 css:层叠样式表,负责页面样式 js:轻量级的脚本语言,负责页面的动效和数据交互 小总结:结构,样式和行为,三者相分离 在htm ...

随机推荐

  1. 动态更改WebBrowser数据流内容

    动态更改WebBrowser数据流内容       有时,由于软件的特殊需要,我们希望DELPHI在WebBrowser或embeddedwb里动态更改返回的数据内容,而这需要返回网页的所有原始源码, ...

  2. 转:oralce常用操作、查询语句(查看表空间)

    http://highill.iteye.com/blog/1534858 最近整理一下oralce的常用语句,借此记录一下,在网上都应该能搜到,这里主要是整理分享. 一.操作语句 建立表空间 MYD ...

  3. LeetCode:逆波兰表达式求值【150】

    LeetCode:逆波兰表达式求值[150] 题目描述 根据逆波兰表示法,求表达式的值. 有效的运算符包括 +, -, *, / .每个运算对象可以是整数,也可以是另一个逆波兰表达式. 说明: 整数除 ...

  4. C语言预处理命令之条件编译(#ifdef,#else,#endif,#if等)

    转自:http://www.kuqin.com/language/20090806/66164.html 预处理过程扫描源代码,对其进行初步的转换,产生新的源代码提供给编译器.可见预处理过程先于编译器 ...

  5. Mysql字段属性应该尽量设置为not null

    除非你有一个很特别的原因去使用 NULL 值,你应该总是让你的字段保持 NOT NULL.这看起来好像有点争议,请往下看. 所谓的NULL就是什么都没有,连\0都没有,\0在字符串中是结束符,但是在物 ...

  6. EasyUI:所有的图标

    EasyUI:所有的图标 所有的图标在 jquery-easyui-1.2.6/themes/icons 目录下: jquery-easyui-1.2.6/themes/icon.css .icon- ...

  7. Vim:gvim安装配置(windows)

    Vim:gvim安装配置(windows) 一.gvim的特点: vim要求全部键盘操作,而gvim可以使用鼠标进行可视化操作,即gvim是vim的图形化界面: 二.gvim安装: 下载地址:http ...

  8. 关于Block汇总

    //使用总结: //1.当block里面会有b类相关的参数要回调回去的时候,属性用copy修饰,将其拷贝到堆里面,这样即便栈释放掉了,b类的指针也在堆中存在,能够成功的回调回去. //Block默认存 ...

  9. Effective C++ 条款01:视C++为一个语言联邦

    四个次语言 C Object-Oriented C++ Template C++ STL

  10. asp.net Core 部署到CentOs7上,使用Nginx做代理

    一.CentOs7部署Nginx 1.准备工作 Nginx的安装依赖于以下三个包,意思就是在安装Nginx之前首先必须安装一下的三个包,注意安装顺序如下: 1 SSL功能需要openssl库,直接通过 ...