怎么让一个计时器可以不停地暂停和开始呢

个回答

向死而生3491500

2016-09-18 17:56:56

已采纳

看了一下各位的代码，把我刚做的倒计时加了个开始和停止。。。
分析原理：
1. 定义一个变量装时间函数“sh = setTimeout(setTime,500) ‘’;
2. 网页开始时是开始及时的，开始（setTimeout）和停止（ clearInterval）应在设置时间函数的外面去控制
0

深渊大魔王4100108: 2016-10-12 10:47:33

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
   function clock(){
      var time=new Date();               	  
      document.getElementById("clock").value = time;
   }
    var myvalue=setInterval(clock,1000); 
    function cclock()
    {
        myvalue=setInterval(clock,1000); 
    }
</script>
</head>
<body>
  <form>
    <input type="text" id="clock" size="50"  />
    <input type="button" id="stop" value="Stop" onClick="clearInterval(myvalue)" />
    <input type="button" id="continun" value="continun" onClick="cclock()"/>
  </form>
</body>
</html>

我做这题的时候也想设置一个开始按钮我这么写自己测试是可以实现开始跟暂停但不知道有没有什么其他问题

隔壁诸葛村夫

2016-09-18 20:52:34

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
var a;
function clock(){
var time=new Date();
var atime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();//获取具体时间
document.getElementById("cloc").value = atime;//将获取的时间在文本框内显示出来
}
function p(){
a=setInterval("clock()",2000);//计时器
}
function q(){
clearInterval(a);//清除计时器
}
</script>
</head>
<body>
<form>
<input type="text" id="cloc" size="50" />
<input type="button" value="Stop" onclick="q()" />
<input type="button" value="Start" onclick="p()" />
</form>
</body>
</html>
我把这个计时器重新写了下，点开始时才开始计时。

0
向死而生3491500

2016-09-18 17:51:01

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <script type="text/javascript" language="JavaScript">
           var sh;
           window.onload = function(){
               setTime();
           }
           function checkTime(t){
               if(t<10){
                   t="0"+t;
               }
               return t;
           }
           function setTime(){
               var nowTime = new Date();                //当前系统时间
               var endTime = new Date("2016/10/01,00:00:00"); // 结束时间
               var chaTime = parseInt((endTime.getTime() - nowTime.getTime())/1000);//获取时间戳   getTime()将时间戳处理成毫秒数

               var d = Math.floor(chaTime/(24*60*60)); //天
               var h =   Math.floor((chaTime/(60*60))%24);//时
               var m = Math.floor((chaTime/(60))%60);   //分
               var s = Math.floor(chaTime%60);           //秒
                   m = checkTime(m);
                   s = checkTime(s);

               if(chaTime<=0){
                   document.getElementById("showTime").innerHTML="团购结束";
               }else{
                   document.getElementById("showTime").innerHTML=
               "距离10月1号还剩"+d+"天"+h+"时"+m+"分"+s+"秒";
               clearInterval(sh);//清除计时器
               }
               sh=setTimeout(setTime,500);
           }
               var start = function(){
               sh=setTimeout(setTime,500);
               }
               var stop = function(){
                   clearInterval(sh);
               }
       </script>
   </head>
   <body>
       <span id="showTime" style="color: red;"></span>
       <input type="button" value="停止倒计时" onclick="stop()"/>
       <input type="button" value="开始倒计时" onclick="start()"/>
   </body>
</html>

0
隔壁诸葛村夫

2016-09-18 17:10:47

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
function clock(){
var time=new Date();
// document.write(time+"<br />");//获取时间
var atime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();//获取具体时间
document.getElementById("cloc").value = time;//将获取的时间在文本框内显示出来
}
var aa=setInterval("clock()",2000);//计时器
function s(){
aa=setInterval("clock()",2000);//计时器
}
</script>
</head>
<body>
<form>
<input type="text" id="cloc" size="50" />
<input type="button" value="Stop" onclick="clearInterval(aa)" />
<input type="button" value="Start" onclick="s()" />
</form>
</body>
</html>
貌似我把第九行注释掉就没问题了，可以开始和停止了

0
别着急

2016-09-18 17:04:48

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
var panduan;
function clock(){
var time=new Date();
var atime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();
document.getElementById("cloc").value = atime;
}
panduan=setInterval("clock()",1000);
function start(){
panduan=setInterval("clock()",1000);
}
function delet(){
clearInterval(panduan);
}

</script>
</head>
<body>
<form>
<input type="text" id="cloc" size="50" />
<input type="button" value="Stop" onclick="delet()" />
<input type="button" value="start" onclick="start()" />
</form>
</body>
</html>

0
别着急

2016-09-18 16:55:37

额，我这边连暂停都不行0.0

0
别着急

2016-09-18 16:38:16

把下面呢个按钮添加为onclick=setInterval("clock()",2000);你试试

0