JavaScript中setInterval的用法总结


Posted in Javascript onNovember 20, 2013

setInterval动作的作用是在播放动画的时,每隔一定时间就调用函数,方法或对象。可以使用本动作更新来自数据库的变量或更新时间显示。

setInterval动作的语法格式如下:
setInterval(function,interval[,arg1,arg2,......argn])
setInterval(object,methodName,interval[,arg1,arg2,.....argn])

第一种格式是标准动作面板中setInterval函数的默认语法,第二种格式是在专家模式动作中使用的方法。

其中的参数function是一个函数名或者一个对匿名函数的引用。object参数指定从Object对象派生的对象。methodName制定 object参数中要调用的方法。

interval制定对function或methodName调用两次之间的时间,单位是毫秒。后面的arg1等是可选的参数,用于制定传递给function或是methodName的参数。

setInterval它设置的时间间隔小于动画帧速(如每秒10帧,相当于100毫秒),则按照尽可能接近interval的时间间隔调用函数。

而且必须使用updateAfterEvent动作来确保以足够的频率刷新屏幕。如果interval大于动画帧速,则只用在每次播放头进入某一帧是才调用,以减小每次刷新屏幕的影响。

下面的例子每隔1秒调用一次匿名函数。
setInterval(function(){trace("每隔1秒钟我就会显示一次")},1000);//这里的function(){}是没有函数名的函数。成为匿名函数,后面的1000是时间间隔,单位是毫秒。

下面的例子为我们展示如何带参数运行。

function show1(){
    trace("每隔1秒显示一次");
}
function show2(str){
    trace(str);
}
setInterval(show1,1000);
setInterval(show2,2000,"每隔2秒我就会显示一次");

上面已经将函数的setInterval方法介绍了。

下面我们将介绍对象的setInterval方法。

首先,写一个setInterval在动作中调用对象的方法的例子,该例子不需要传递参数。

myobj=new Object();//创建一个新的对象
myobj.interval=function){
    trace("每隔1秒显示一次");
}//创建对象的方法。
setInterval(myobj,"interval",1000);//设定时间间隔调用对象的方法。

接下来介绍如何传递参数。其实道理和函数的传递参数是一样的。
myobj=new Object();
myobj.interval-function(str){
    trace(str);
}
setInterval(myobj,"interval",2000," 每隔2秒我就会显示一次");

注意。要调用为对象定义的方法时,必须在专家模式中使用第二种语法格式。

这样子的话呢,我们来作一个动态显示时间的画面。可以用下面的代码实现。

setInterval(show,1000);
function show(){
    time=new Date();
    hour=time.getHours();
       minu=time.getMinutes();
       sec=time.get.Seconds();
    datetime=hour+":"+minu+":"+sec;
}//这里的datetime是一个动态文本框的变量名字。

这样子呢,setInterval这个方法大家应该学的很好了。现在呢,我们学习clearInterval.

clearInterval动作的作用是清楚对setInterval函数的调用,它的语法格式如下clearInterval(intervalid);intervalid是调用setInterval函数后返回的对象。

下面举一个简单的例子。

function show(){
    trace("每隔一秒显示一次");
}
var sh;
sh=setInterval(show,1000);
clearInterval(sh);
Javascript 相关文章推荐
jQuery 表格工具集
Apr 25 Javascript
js实现浏览器的各种菜单命令比如打印、查看源文件等等
Oct 24 Javascript
浅析Node.js查找字符串功能
Sep 03 Javascript
Window.Open打开窗体和if嵌套代码
Apr 15 Javascript
JavaScript仿百度图片浏览效果
Nov 23 Javascript
Angular.js初始化之ng-app的自动绑定与手动绑定详解
Jul 31 Javascript
jQuery Datatable 多个查询条件自定义提交事件(推荐)
Aug 24 jQuery
微信小程序数据存储与取值详解
Jan 30 Javascript
详解Vue中使用Axios拦截器
Apr 22 Javascript
解决layui弹出层layer的area过大被遮挡的问题
Sep 21 Javascript
mpvue实现左侧导航与右侧内容的联动
Oct 21 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
Apr 17 Javascript
JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
Nov 20 #Javascript
jquery iframe操作详细解析
Nov 20 #Javascript
JS获取当前日期和时间的简单实例
Nov 19 #Javascript
js 自动播放的实例代码
Nov 19 #Javascript
鼠标滚轴控制文本框值的JS代码
Nov 19 #Javascript
jquery交替变换颜色的三种方法 实例代码
Nov 19 #Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 #Javascript
You might like
PHP读MYSQL中文乱码的解决方法
2006/12/17 PHP
简介PHP的Yii框架中缓存的一些高级用法
2016/03/29 PHP
PHP 二维array转换json的实例讲解
2018/08/21 PHP
js查找父节点的简单方法
2008/06/28 Javascript
获取网站跟路径的javascript代码(站点及虚拟目录)
2009/10/20 Javascript
JQuery获取各种宽度、高度(format函数)实例
2013/03/04 Javascript
JS获取后台Cookies值的小例子
2013/03/04 Javascript
node.js中的fs.writeFile方法使用说明
2014/12/14 Javascript
js实现图片点击左右轮播
2015/07/08 Javascript
Nodejs进阶:核心模块net入门学习与实例讲解
2016/11/21 NodeJs
javascript实现圣旨卷轴展开效果(代码分享)
2017/03/23 Javascript
原生JS改变透明度实现轮播效果
2017/03/24 Javascript
基于Vue过渡状态实例讲解
2017/09/14 Javascript
无限循环轮播图之运动框架(原生JS实现)
2017/10/01 Javascript
mpvue中使用flyjs全局拦截的实现代码
2018/09/13 Javascript
详解vuejs2.0 select 动态绑定下拉框支持多选
2019/04/25 Javascript
在JavaScript中使用严格模式(Strict Mode)
2019/06/13 Javascript
python Django框架实现自定义表单提交
2016/03/25 Python
django中send_mail功能实现详解
2018/02/06 Python
pytorch + visdom CNN处理自建图片数据集的方法
2018/06/04 Python
pandas 数据归一化以及行删除例程的方法
2018/11/10 Python
Python绘制二维曲线的日常应用详解
2019/12/04 Python
python求numpy中array按列非零元素的平均值案例
2020/06/08 Python
python语言的优势是什么
2020/06/17 Python
世界最大的私人旅行指南出版商:孤独星球
2016/08/23 全球购物
单位介绍信范文
2014/01/18 职场文书
运动会开幕式邀请函
2014/02/03 职场文书
幼儿园教学随笔感言
2014/02/23 职场文书
团代会宣传工作方案
2014/05/08 职场文书
活动倡议书范文
2014/05/13 职场文书
委托证明书
2014/09/17 职场文书
党政领导班子民主生活会整改措施
2014/09/18 职场文书
2016形势与政策学习心得体会
2016/01/12 职场文书
资深HR教你写好简历中的自我评价
2019/05/07 职场文书
Python opencv缺陷检测的实现及问题解决
2021/04/24 Python
详解nodejs内置模块
2021/05/06 NodeJs