Der folgende Code ist ein einfacher Timer, aber wenn Sie mehr als zwei Mal hintereinander auf die Timing-Schaltfläche klicken, beschleunigt sich die Zeitmessung und kann nicht angehalten werden (kann nicht gestoppt werden ~~). Brauchen Sie eine Lösung?
<!DOCTYPE html>
<html>
<head>
<title>
计时器
</title>
<style type="text/css">
p {
width: 400px;text-align:center;height: 500px;font-weight: 700;background-color: #ccc;font-size: 400px;margin: 0 auto;
}
</style></head>
<body>
<p><font color="red" size="28"></font></p>
<input type="button" value="计时开始⌚️">
<input type="button" value="计时暂停⏸️">
<script type="text/javascript">
//计时开始方法
var i = 0;
var times;
var prebtn = document.getElementsByTagName("input")[0].onclick=function()
{
times = window.setInterval(function(){
i++
document.getElementsByTagName("p")[0].innerHTML=i;
},1000);
}
//计时结束方法
var nextbtn = document.getElementsByTagName("input")[1].onclick=function()
{
var cleartimes = window.clearInterval(times);
}
</script></body>
</html>
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
计时的函数里判断
times如果有值，直接返回;或者有值的情况下先
clearInterval然后再重新setInterval点2次等于设定了2个计时器，所以会坑。