第一个回合后,倒数计时器中的setInterval被执行多次

lycheelichi

希望大家安全

我正在尝试使用以下代码找出一个简单的倒计时计时器:

发生的是我第一次单击它时效果很好,按秒倒数计算它应该如何工作。但是,从第二次开始,它变得“更快”,每秒变为2个数字。第3次每秒显示3个数字,或者如果我一次单击几次,它也“更快”

我认为这是因为间隔相加(以某种方式?)并每秒执行相同的代码n *次。但是我不知道每次应该在哪里/如何完全清除间隔?

希望这对你们有意义,并在此先感谢您的帮助

    function makeTimer(){
  
  document.getElementById("button-1").innerHTML = "Stop Countdown";
  timeLeft = document.getElementById("set-time").value;
 
  // buttonChange()
  document.getElementById("set-time").value = ""
    setInterval(function(){
      if(timeLeft <=0){
        clearInterval(timeLeft = 0)
      }
          document.getElementById("timer-id").innerHTML = timeLeft+"s"
          timeLeft = timeLeft - 1

    },1000)
    
}

function toggleTimer(){
  // clearInterval(timeLeft)
  button = document.getElementById("button-1")
  if(button.innerHTML ==='Click to countdown'){
    makeTimer()
  }else if(button.innerHTML=== "Stop Countdown"){
    clearInterval(timeLeft = 0)
    button.innerHTML = "Click to countdown"
  }
}
大卫

您使用clearInterval不正确。

setInterval返回对计时器的引用,然后您必须传递该引用clearInterval以停止它。

例:

var myTimer = setInterval(myFunction, 1000); //Starts the timer

clearInterval(myTimer); //Stops the timer

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

第一个程序:javascript倒数计时器

在JavaScript中创建一个倒数计时器,该计时器在1小时后开始倒数

在 Vuex 中第一个计时器到期后如何启动第二个计时器?

如何在计时器刻度中停止第一个IF?

一个简单的JavaScript倒数计时器的代码?

美化一个倒数计时器

如何制作一个基本的倒数计时器

如何仅在第一个元素上启动 CustomTrigger 中的处理时间计时器?

创建一个倒数计时器(考虑到SetInterval / Timeout Google Chrome标签“错误”)

如何在 Javascript 中创建一个倒数计时器?

如何在Kotlin中创建一个简单的倒数计时器?

在React JS中,我正在尝试创建一个倒数计时器,但无法将第一秒变成一整秒

发出第一个值,然后忽略计时器内发出的值

如何制作一个倒数计时器而不是倒数计时器?(PHP, JQUERY AJAX)

为什么我的React应用程序中的后续警报显示给定会话中显示的第一个警报的“ useCountdown挂钩计时器”?

如何使用在第一个循环中立即运行的计时器来实现 for 循环机制?

多次包含倒数计时器

在MKMapViewDelegate中执行代码之前设置一个计时器

修复一个看起来不稳定的倒数计时器

Android 倒数计时器迄今为止和下一个活动?

React:倒数计时器,如何每秒减少一个状态值?

创建一个以用户输入开头的Java GUI倒数计时器

Javascript隐藏div并使用简单的倒数计时器显示另一个div

使用Clojure / Reagent制作一个简单的倒数计时器

如何使setInterval countUp计时器即使在“另一个页面”或“浏览器刷新”中也保持计数?

在React中创建一个计时器

在javascript中创建一个计数计时器

在我的代码中添加一个计时器

在问卷中添加一个小计时器