Javascript 那个按钮上有奇怪的行为

我试图在codepen上制作一个pomodoro时钟，我知道我的代码还不完美，但我看到我的开始按钮有一个非常奇怪的行为，当我点击它时，它启动计时器。但是当我把它砸了好几次，它就会发疯，计时器也会越来越快，有人能告诉我为什么以及如何避免它吗

或者在那里查看我的代码：

let pause=“5”；
让duree=“25”；
设min=“5”；
设nb=0；
放手
document.getElementById（“输出”）.innerHTML=暂停；
document.getElementById（“output2”）.innerHTML=duree；
功能添加一（btn）{
暂停=暂停+“+1”；
控制台日志（暂停）；
清除超时（go）；
document.getElementById（“输出”）.innerHTML=eval（暂停）；
暂停=评估（暂停）；
}
功能一（btn）{
清除超时（go）；
如果（评估（暂停）==0）{
暂停=暂停+“”；
}否则{
暂停=暂停+“-1”；
}
document.getElementById（“输出”）.innerHTML=eval（暂停）；
暂停=评估（暂停）；
}
函数addOne1（btn）{
清除超时（go）；
最小值=最小值+“+1”；
document.getElementById（“output2”）.innerHTML=eval（min）；
document.getElementById（“min1”）.innerHTML=eval（min）+“：”；
最小值=评估值（最小值）；
}
功能1（btn）{
如果（评估（duree）==0）{
duree=duree+“”；
}否则{
最小值=最小值+“-1”；
}
document.getElementById（“output2”）.innerHTML=eval（min）；
document.getElementById（“min1”）.innerHTML=eval（min）+“：”；
清除超时（go）；
最小值=评估值（最小值）；
}
document.getElementById（“min1”）.innerHTML=min+“：”；
document.getElementById（“sec”）.innerHTML=“”+nb；
函数doSomething（）{
如果（nb>0）{
nb=nb-1；
}否则，如果（最小值>0）{
nb=59；
闵--；
}否则{
最小=暂停
}
go=设置超时（剂量计，1000）；
document.getElementById（“min1”）.innerHTML=min+“：”；
document.getElementById（“sec”）.innerHTML=nb；
}

#damn1{
左侧填充：50px；
}
#该死的{
左侧填充：450px；
}
#上下文2{
显示器：flex；
}
.txt{
颜色：#ffcf40；
字体大小：45px；
}
布托先生{
边界半径：50px；
背景#ffcf40；
文字装饰：无；
}
#输出{
字体大小：100px；
}
#输出2{
字体大小：100px；
}
#鲍顿{
高度：100px；
宽度：100px；
利润上限：200px；
}
#min1{
利润上限：200px；
字体大小：100px；
颜色：#ffcf40；
}
#秒{
颜色：#ffcf40；
利润上限：200px；
字体大小：100px；
}
身体{
背景：黑色；
}
#cont1{
显示器：flex；
证明内容：中心；
}
#康特纽{
边缘顶部：50px；
显示器：flex；
证明内容：中心；
}
艾尔先生{
宽度：100px；
高度：100px；
颜色：#ffcf40；
}
.el1{
宽度：100px；
高度：100px；
颜色：#ffcf40；
}
#头衔{
保证金：0自动；
文本对齐：居中；
}

波莫多罗 暂停 会期

---

每次单击都必须清除超时或不再设置超时。 我给你看后一个

Html:

<div id="title">POMODORO </div>
<div id="conteneur2">
  <div class="txt" id="damn1">Pause</div>
  <div class="txt" id="damn">Length of sessions</div>
  </diV>
<div id="supercont1">
<div id="conteneur">



  <div class="el1"><input class="buto" type="button" value="-1 minute" onclick='minusOne(this)'/></div>

  <div id="output" class="el"></div>

   <div class="el1"><input class="buto"   type="button" value='+1 Minute' onclick='addOne(this)'/></div>

  <div  id="min1"class="el">


  </div>

  <div id="sec" class="el">


  </div>
  <div id ="start"><input class="buto"  type="button" id="bouton" value="START" onclick='doSomethingElse()'/></div>


  <div  class="el"><input class="buto"  type="button" value='-1 Minute' onclick='minusOne1(this)'/></div>

  <div id="output2" class="el1"></div>

   <div class="el"><input class="buto"  type="button" value='+1 Minute' onclick='addOne1(this)'/></div>


</div>
</div>

---

您还需要在doSomthing函数中清除超时：

函数doSomething（）{
如果（nb>0）{
nb=nb-1；
}否则，如果（最小值>0）{
nb=59；
闵--；
}否则{
最小=暂停
}
清除超时（go）；
go=设置超时（剂量计，1000）；
document.getElementById（“min1”）.innerHTML=min+“：”；
document.getElementById（“sec”）.innerHTML=nb；
}

---

实际上，单击

Start

按钮并没有清除之前的超时。 只要点击它就可以清除它

将其添加到内联JS中

  <div id ="start"><input class="buto"  type="button" id="bouton" value="START" onclick='clearTimeout(go);doSomethingElse();'/></div>

每次单击开始，创建了一个新的

setTimeout

任务。我没有看到你的代码，只是单击了开始按钮。我可以说，当我第一次单击减法时，减法出现了问题。当我第二次单击时，你附加的值再次递减，比如说，在最初单击时，它是-1，如果我单击第二次它转到-2，并显示您单击的次数。所以，看看这个，如果你需要更多的帮助，让我知道。只是一些其他的指针，为什么你不在计时器启动后也禁用这个按钮呢？您需要更好地命名您的变量-这样您的代码是可读的

  <div id ="start"><input class="buto"  type="button" id="bouton" value="START" onclick='clearTimeout(go);doSomethingElse();'/></div>