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)的更多相关文章
- Node.js中setTimeout和setInterval的使用
Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...
- JavaScript之setInterval() 函数
定义和用法 setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被 ...
- Flex(flash)检测摄像头的3种状态(是否被占用,没安装摄像头,正常)
在视频程序的编写过程中,我们经常要使用摄像头,在使用摄像头前有必要对摄像头的现有状态做个检测: 1.被占用 2.没安装摄像头 3.正常 camera=Camera.getCamera(); ...
- commonJS — DOM操作(for DOM)
for DOM github: https://github.com/laixiangran/commonJS/blob/master/src/forDOM.js 代码 /** * Created b ...
- Web 前端 —— javaScript
目录: 资源链接 基础知识 基础问题集 资源链接: http://www.w3school.com.cn/ 弹出窗口,变暗特效:http://www.csrcode.cn/article-584-1. ...
- 读书笔记: nodejs API 参考
>> bufferBuffer对象是全局对象Buffer支持的编码方式:ascii, utf8, base64, binarynew Buffer(size)new Buffer(arra ...
- JavaScript实现动画效果
说到JavaScript实现动画效果,不得不想到两个函数,setTimeout和setInterval. setTimeout的常用的使用方法为 setTimeout(callback, delay) ...
- Node.js学习笔记(四): 全局对象
在浏览器 JavaScript 中,通常 window 是全局对象, 而 Node.js 中的全局对象是 global,所有全局变量(除了 global 本身以外)都是 global 对象的属性. 这 ...
- JavaScript 知识点
JS基础 页面由三部分组成: html:超文本标记语言,负责页面结构 css:层叠样式表,负责页面样式 js:轻量级的脚本语言,负责页面的动效和数据交互 小总结:结构,样式和行为,三者相分离 在htm ...
随机推荐
- [转]Asp.net MVC 中Ajax的使用
Asp.net MVC 抛弃了Asp.net WebForm那种高度封装的控件,让我们跟底层的HTML有了更多的亲近.可以更自由.更灵活的去控制HTML的结构.样式和行为.而这点对于Ajax的应有来说 ...
- go——结构体(二)
Go语言是一种静态类型的编程语言.这意味着,编译器需要在编译时知晓程序里每个值的类型. 如果提前知道类型信息,编译器就可以确保程序合理的使用值. 这有助于减少潜在的内存异常和bug,并且使编译器有机会 ...
- Hive2.2.1概述(待重写)
概述 hive 是一个包裹着 hdfs 的壳子,hive 通过 hql,将 sql 翻译成 MR ,进行数据查询. Hive是⼀个构建在Hadoop之上的数据仓库 hive的数据存在hdfs上,元信息 ...
- netty4----netty5的客户端和服务端
服务端: package com.server; import io.netty.bootstrap.ServerBootstrap; import io.netty.channel.Channel; ...
- Linux 搭建 SVN
一.yum 安装 subversion yum -y install subversion 二.创建svn版本库所在路径(建议放在opt.usr.home下) mkdir -p /usr/local/ ...
- JSP与Servlet之后台页面单条删除与多条删除的页面跳转之实现
单条删除页面跳转 1.首先打开JSP页面,找到删除 2.这个时候要把它改成servlet的URL,并决定要传给后台什么数据,例如我需要传一个待删数据的ID id并不是什么见不得人的东西(而且是后台也不 ...
- 微软名人数据集 ms_celeb_1m 处理(MsCelebV1-Faces-Aligned.tsv)python脚本
本文主要介绍了如何对MsCelebV1-Faces-Aligned.tsv文件进行提取 原创by南山南北秋悲 欢迎引用!请注明原地址 http://www.cnblogs.com/hwd9654/p/ ...
- TensorFlow实现CNN
TensorFlow是目前深度学习最流行的框架,很有学习的必要,下面我们就来实际动手,使用TensorFlow搭建一个简单的CNN,来对经典的mnist数据集进行数字识别. 如果对CNN还不是很熟悉的 ...
- CentOS 7安装Xfce和VNC
很多VPS商提供的CentOS 7镜像只有最小化安装,这样就只能在命令行下操作,如果要调试代码的话,还是图形化界面方便,而且CentOS自带的Gnome和KDE都比较占内存.启动桌面后就占用了400M ...
- 初入spring boot(四 )web项目
1. 模板引擎 spring boot提供了大量的模板引擎,包括FreeMark.Groovy.Thymeleaf.Velocity等,但spring boot中推荐用Thymeleaf,因为Thym ...