码迷,mamicode.com
首页 > 其他好文 > 详细

一个计时器, 点击按钮 让他 停一会, 5s后继续自动运行

时间:2015-08-13 19:44:59      阅读:132      评论:0      收藏:0      [点我收藏+]

标签:

<div id="time" style="border:solid 1px #ddd; display:inline-block; width:50px; height:30px; vertical-align:middle"></div>
<input type="button" id="btn" value="停止">


<script type="text/javascript"> // 一个计时器, 点击按钮 让他 停一会, 5s后继续自动运行 var num=0; var data=1000; var timeout=false; function autoSide(){ num +=1; $("#time").html(num); } var t=setInterval(autoSide,data); $("#btn").click(function(){ t= clearInterval(t); var timeout = setTimeout(function(){ t= setInterval(autoSide,data); },5000); }) </script>

 第二种方式:

<div id="time" style="border:solid 1px #ddd; display:inline-block; width:50px; height:30px; vertical-align:middle"></div>
<input type="button" id="btn" value="停止">

<script type="text/javascript">

 var num=0;
 var data=1000;
 var timeout=false;
 
 function oNum(){
     num++;
         $("#time").html(num);
     }
 
 function autoSide() {
     if (timeout) {
         setTimeout(autoSide, 5000);
         timeout = 0;
     } else {
         setTimeout(autoSide, 1000);
         oNum();
     }

}
 
$("#btn").click(function () {
    timeout = 1;    
})

autoSide();

</script>

 

一个计时器, 点击按钮 让他 停一会, 5s后继续自动运行

标签:

原文地址:http://www.cnblogs.com/yjhua/p/4727945.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!