Javascript ClearTimeout 不起作用

Javascript ClearTimeout doesnt work

我正在为我的代码寻找解决方案。我的 clearTimeout 函数在 stop() 中不起作用;和开始();功能,有人知道如何解决这个问题吗?

停止、启动、复位按钮都有setTimeout功能。我想做的是,如果在其中一个按钮上单击,则其他两个按钮都有 cleartimeout。但不知何故,它现在不起作用。

var isTimerStarted;
var timeOutElse;
var timeOut;
var opnieuw;

function start() {
    clocktimer = setInterval("update()", 1);
    x.start();
    isTimerStarted = true;
    timeOutElse = setTimeout(function(){
        document.getElementById("scherm3").style.display = "block";
        document.getElementById("scherm2.2").style.visibility = "hidden";
    }, 8000)
}

function stop() {
    x.stop();
    clearInterval(clocktimer);
    isTimerStarted = false;
    timeOut = setTimeout(function(){
        document.getElementById("scherm4").style.visibility = "visible";
        document.getElementById("scherm2.2").style.visibility = "hidden"; 
    }, 4000)
}

function reset() {
    stop();
    x.reset();
    update();
    opnieuw = setTimeout(function(){
        document.getElementById("scherm3").style.display = "block";
        document.getElementById("scherm2.2").style.visibility = "hidden"; 
    }, 10000);    
    clearTimeout(timeOut);
    clearTimeout(timeOutElse);
    document.getElementById("buttontimer").value = "Start";
} 

setTimeout(start, 5000);

function toggleTimer(event) {
    if (isTimerStarted) {
        stop();
        event.target.value = 'Start';
        clearTimeout(opnieuw);
        clearTimeout(timeOutElse);
    } else {
        start();
        event.target.value = 'Stop';
        clearTimeout(opnieuw);
        clearTimeout(timeOut);
    }
 }

据我所知,您的代码没有任何问题。

但我认为您可能忘记从中删除一行。

setTimeout(start, 5000); 在 5 秒后创建超时 whatever/whenever 你点击一个东西。

这可能会造成计时问题。

这是一种可能发生的情况:

  • 你点击
  • toggleTimer() -> start() -> 创建超时和间隔
  • 5 秒后您的 setTimeout(start, 5000) 执行并重新分配您的超时和间隔变量
  • 您重新点击
  • 最新的超时和间隔被清除,但不是第一个

为了安全起见,您可以在每个函数的开头清除您在上述函数中创建的超时和间隔。

这样,您将始终清除创建的超时和间隔。