编程语言
首页 > 编程语言> > 带有开始和停止按钮的javascript倒计时器

带有开始和停止按钮的javascript倒计时器

作者:互联网

我需要制作一个简单的倒数计时器,从5到0,按钮启动并停止计数器.我唯一不知道的是为什么我的柜台不会停止.

代码如下:

   function clock() {
     var myTimer = setInterval(myClock, 1000);
     var c = 5;

     function myClock() {
       document.getElementById("demo").innerHTML = --c;
       if (c == 0) {
         clearInterval(myTimer);
         alert("Reached zero");
       }
     }
   }
<p id="demo">5</p>
<button onclick="clock()">Start counter</button>
<button onclick="clearInterval(myTimer)">Stop counter</button>

解决方法:

在这里,你只需要让myTimer全球化.我还修复了一个故障,重置计时器后,它不会显示5.

var myTimer;
   function clock() {
     myTimer = setInterval(myClock, 1000);
     var c = 5;

     function myClock() {
       document.getElementById("demo").innerHTML = --c;
       if (c == 0) {
         clearInterval(myTimer);
         alert("Reached zero");
       }
     }
   }
<p id="demo">5</p>
<button onclick="clock(); document.getElementById('demo').innerHTML='5';">Start counter</button>
<button onclick="clearInterval(myTimer);">Stop counter</button>

标签:javascript,counter,countdown,countdowntimer
来源: https://codeday.me/bug/20190715/1465375.html