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 相关文章推荐
addEventListener和attachEvent二者绑定的执行函数中的this不相同
Dec 09 Javascript
点击按钮自动加关注的代码(sina微博/QQ空间/人人网/腾讯微博)
Jan 02 Javascript
Bootstrap每天必学之警告框插件
Apr 26 Javascript
JS遍历对象属性的方法示例
Jan 10 Javascript
jQuery使用JSONP实现跨域获取数据的三种方法详解
May 04 jQuery
2种简单的js倒计时方式
Oct 20 Javascript
js数据类型检测总结
Aug 05 Javascript
详解nuxt路由鉴权(express模板)
Nov 21 Javascript
js前端面试之同步与异步问题详解
Apr 03 Javascript
JavaScript中的垃圾回收与内存泄漏示例详解
May 02 Javascript
jquery实现点击弹出对话框
Feb 08 jQuery
js实现上传图片到服务器
Apr 11 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 header下载函数
2014/01/31 PHP
PHP MVC框架路由学习笔记
2016/03/02 PHP
详细解读php的命名空间(一)
2018/02/21 PHP
php框架CI(codeigniter)自动加载与自主创建对象操作实例分析
2020/06/06 PHP
JQuery EasyUI 日期控件如何控制日期选择区间
2014/05/05 Javascript
JQuery中使用on方法绑定hover事件实例
2014/12/09 Javascript
小米公司JavaScript面试题
2014/12/29 Javascript
Javascript基础教程之for循环
2015/01/18 Javascript
JavaScript中常用的六种互动方法示例
2015/03/13 Javascript
JQuery实现超链接鼠标提示效果的方法
2015/06/10 Javascript
JavaScript实现瀑布流布局
2020/06/28 Javascript
浅谈JavaScript中小数和大整数的精度丢失
2016/05/31 Javascript
检查表单元素的值是否为空的实例代码
2016/06/16 Javascript
多功能jQuery树插件zTree实现权限列表简单实例
2016/07/12 Javascript
BootStrap入门教程(一)之可视化布局
2016/09/19 Javascript
常用原生js自定义函数总结
2016/11/20 Javascript
js实现简单的手风琴效果
2017/02/27 Javascript
vue-cli入门之项目结构分析
2017/04/20 Javascript
JsChart组件使用详解
2018/03/04 Javascript
Vue.js 实现微信公众号菜单编辑器功能(二)
2018/05/08 Javascript
学习jQuery中的noConflict()用法
2018/09/28 jQuery
node 标准输入流和输出流代码实例
2019/09/19 Javascript
vue+elementUI组件table实现前端分页功能
2020/11/15 Javascript
jQuery+PHP+Ajax实现动态数字统计展示功能
2019/12/25 jQuery
Vue v-for中的 input 或 select的值发生改变时触发事件操作
2020/08/31 Javascript
Python聊天室实例程序分享
2016/01/05 Python
python实现微信每日一句自动发送给喜欢的人
2019/04/29 Python
利用Python进行图像的加法,图像混合(附代码)
2019/07/14 Python
jupyter notebook 增加kernel教程
2020/04/10 Python
利用python汇总统计多张Excel
2020/09/22 Python
python 写一个文件分发小程序
2020/12/05 Python
Nili Lotan官网:Nili Lotan同名品牌
2018/01/07 全球购物
领导干部作风建设剖析材料
2014/10/11 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书
Html分层的box-shadow效果的示例代码
2021/03/30 HTML / CSS
SQL写法--行行比较
2021/08/23 SQL Server