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 相关文章推荐
IE与Firefox在JavaScript上的7个不同写法小结
Sep 14 Javascript
jquery无缝向上滚动实现代码
Mar 29 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
Jan 13 Javascript
深入浅析JavaScript中数据共享和数据传递
Apr 25 Javascript
全国省市二级联动下拉菜单 js版
May 10 Javascript
JS图片轮播与索引变色功能实例详解
Jul 06 Javascript
jQuery选择器特殊字符与属性空格问题
Aug 14 jQuery
vue cli使用绝对路径引用图片问题的解决
Dec 06 Javascript
微信小程序template模板与component组件的区别和使用详解
May 22 Javascript
jQuery实现判断滚动条滚动到document底部的方法分析
Aug 27 jQuery
package.json中homepage属性的作用详解
Mar 11 Javascript
通过实例解析js可枚举属性与不可枚举属性
Dec 02 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 多个submit提交表单 处理方法
2009/07/07 PHP
PHP实现多条件查询实例代码
2010/07/17 PHP
php正则匹配html中带class的div并选取其中内容的方法
2015/01/13 PHP
PHP微信开发之二维码生成类
2015/06/26 PHP
浅谈PHP定义命令空间的几个注意点(推荐)
2016/10/29 PHP
PHP mysqli事务操作常用方法分析
2017/07/22 PHP
用PHP做了一个领取优惠券活动的示例代码
2019/07/05 PHP
关于PHP5.6+版本“No input file specified”问题的解决
2019/12/11 PHP
bcastr2.0 通用的图片浏览器
2006/11/22 Javascript
用ADODB.Stream转换
2007/01/22 Javascript
JavaScript 创建对象和构造类实现代码
2009/07/30 Javascript
javascript OFFICE控件测试代码
2009/12/08 Javascript
JavaScript高级程序设计 阅读笔记(二十一) JavaScript中的XML
2012/09/14 Javascript
jQuery中.live()方法的用法深入解析
2013/12/30 Javascript
nodejs中实现sleep功能实例
2015/03/24 NodeJs
AngularJS基础教程之简单介绍
2015/09/27 Javascript
AngularJs中route的使用方法和配置
2016/02/04 Javascript
JavaScript实现点击按钮字体放大、缩小
2016/02/29 Javascript
Zabbix添加Node.js监控的方法
2016/10/20 Javascript
深入浅析Vue组件开发
2016/11/25 Javascript
NodeJS学习笔记之Module的简介
2017/03/24 NodeJs
详谈js模块化规范
2017/07/07 Javascript
详解vue-cli快速构建vue应用并实现webpack打包
2017/12/13 Javascript
javascript实现前端分页功能
2020/11/26 Javascript
vue二选一tab栏切换新做法实现
2021/01/19 Vue.js
Python 判断 有向图 是否有环的实例讲解
2018/02/01 Python
Python实现初始化不同的变量类型为空值
2020/06/02 Python
Foot Locker意大利官网:全球领先的运动鞋和服装零售商
2017/05/30 全球购物
Michael Kors加拿大官网:购买设计师手袋、手表、鞋子、服装等
2019/03/16 全球购物
String是最基本的数据类型吗?
2013/06/13 面试题
软件配置管理有什么好处
2015/04/15 面试题
学院领导推荐信
2013/10/30 职场文书
入党积极分子对十八届四中全会期盼的思想汇报
2014/10/17 职场文书
2015年安全工作总结范文
2015/04/02 职场文书
民间借贷纠纷答辩状
2015/08/03 职场文书
nginx proxy_cache 缓存配置详解
2021/03/31 Servers