首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >setTimeout和setInterval

setTimeout和setInterval

作者头像
tandaxia
发布2018-09-27 12:31:58
1.9K0
发布2018-09-27 12:31:58
举报
文章被收录于专栏:谈补锅谈补锅

setTimeout(methodName, interval); //间隔时间单位为毫秒,表示interval毫秒后执行方法methodName

setInterval(methodName, interval); //间隔时间单位为毫秒,表示每隔interval毫秒执行后都会执行一次方法methodName

执行的方法可以带参数,但是参数只能是字符串、数字类的,不能是对象

实例代码:

 1 <html>
 2     <head>
 3         <title>标题</title>
 4         <meta charset="utf8"/>
 5         <script type="text/javascript">
 6             //测试setTimeout
 7             var runTimeout, runInteval;
 8             function TestTimeout(idName){
 9                 if (!idName) idName = "showInfo";
10                 
11                 document.getElementById(idName).innerText = (new Date()) + ", runTimeout = " + runTimeout;
12                 runTimeout = setTimeout("TestTimeout('showInfo')", 1000); //一秒后执行
13                 //或者写作:runTimeout = setTimeout(TestTimeout, 1000); //一秒后执行
14             }
15 
16             function TestClearTimeout(){
17                 clearTimeout(runTimeout);
18                 runTimeout = null;
19                 document.getElementById("showInfo").innerText = "setTimeout()停止了,  runTimeout = " + runTimeout;
20             }
21 
22             //测试setInterval
23             function ChangeTime(idName){
24                 document.getElementById(idName).innerText = (new Date()) + ", runInteval = " + runInteval + ", runTimeout = " + runTimeout;
25             }
26 
27             function TestInterval(){
28                 if (runInteval){
29                     return;
30                 }
31                 runInteval = setInterval("ChangeTime('showInfo2')", 1000); //每过一秒就调用ChangeTime()方法
32                 //或者写作:runInteval = setInterval(ChangeTime, 1000);//需要带参数的话就用上面那种写法
33             }
34             //停止setInterval
35             function TestClearInterval(){
36                 clearInterval(runInteval);
37                 runInteval = null;
38                 document.getElementById("showInfo2").innerText = "setInterval()停止了,  runInteval = " + runInteval;
39             }
40 
41 
42         </script>
43     </head>
44     <body>
45         <h3 id="showInfo"></h3>
46         <h3 id="showInfo2"></h3>
47         <input type="button" value="测试timeout" onclick="TestTimeout()"/>
48         <input type="button" value="停止timeout" onclick="TestClearTimeout()"/>
49         <input type="button" value="测试interval" onclick="TestInterval()"/>
50         <input type="button" value="停止interval" onclick="TestClearInterval()" />
51     </body>
52 </html>
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2015-05-28 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档