停止javascript计时器在后台运行

我在创建JS计时器时遇到问题。当时间结束或手动停止时，函数将持续执行秒-，因此即使时间重置，当再次启动时，它也将以双倍的速度运行。如何手动停止功能？我试着给它贴上标签，并使用断开标签；没有多少成功。这是我的密码

HTML

JS

---

我省略了有关cookies的函数。谢谢大家

如果您指的是停止在间隔上运行的代码，只需调用clearIntervalintervalHandle即可

---

我可能完全错了，但我认为您不想将变量作为字符串传递给clearInterval。调用clearIntervalintervalHandle而不是调用ClearIntervalHandle

clearIntervalintervalHandle；那不应该用绳子。它应该接受setInterval返回的值不完全是，我可以清除间隔。问题是，在我再次启动间隔后，秒-再次执行，因此它每半秒运行一次。为了让你明白，如果我按play 20次，时间会非常快fast@sky_io这是因为你并没有真正地清除间隔，你只是认为你在清除间隔。@skY\u io-只是为了检查一下，为什么不在你的tick函数中添加一个console.log“test”。然后，当您运行它时，您将看到它注销test、test、test等。当您单击stop（停止）时，如果您实际上正在清除间隔，日志记录将停止。-如果它继续，您就没有清除间隔。@skY\u io-没问题，很乐意帮忙。如果这解决了您的问题，请记住接受为正确，以便其他人知道您是如何解决问题的。我做了几次测试，一切正常。我不知道我怎么没想到，至少我得说我是个新手。真的谢谢你，菲尔！

<div id="clock-form">
        <i class="fa fa-clock-o" aria-hidden="true"></i> 
        <input type="number" step="10" id="time-minutes" class="time" value="30"><div id="clock-time"></div></div>
        <div id="clock-buttons">
        <button id="play-button" type="submit" name="play"><i class="fa fa-play clock-buttons" aria-hidden="true"></i></button>
        <button id="stop-button" type="submit" name="stop"><i class="fa fa-stop clock-buttons" aria-hidden="true"></i></button>
        </div>

    window.onload = function() {

    if(getCookie("date2")) {
        startCountdown();
    }

    var inputMinutes = document.getElementById("minutes");

    var startButton = document.getElementById("play-button");
    startButton.onclick = function() {
        startCountdown();
    }

    stopButton = document.getElementById("stop-button");
    stopButton.onclick = function() {
        delete_cookie("date2");
        clearInterval("intervalHandle");
        document.getElementById("clock-time").style.display = "none";
        document.getElementById("time-minutes").style.display = "inline";
        // Stop here?   
    }
}

function startCountdown() {
    var minutes = document.getElementById("time-minutes").value;

    if(isNaN(minutes)) {
        alert("Por favor, inserir um número");
        return;
    }
        var dateNow = Math.floor(new Date());

    if(!getCookie("date2")) {
        var dateEnd = (dateNow + (minutes * 60000));
    } else {
        var dateEnd = getCookie("date2");
    }   

    document.cookie = "date2="+dateEnd;

    secondsRemaining = Math.floor((dateEnd - dateNow) / 1000);

    intervalHandle = setInterval(tick, 1000);

    document.getElementById("time-minutes").style.display = "none";
    document.getElementById("clock-time").style.display = "inline";
}


function tick() {
    var timeDisplay = document.getElementById("clock-time");
    var min = Math.floor(secondsRemaining / 60);
    var sec = secondsRemaining - (min * 60);

    if (sec < 10) {
        sec = "0" + sec;
    }

    var message = min + ":" + sec;
    timeDisplay.innerHTML = "<div style=\"display:inline-block; font-family: 'Open Sans'; font-size:0.9em; font-weight: bold;\">" + message + "</div>";

    if(secondsRemaining === 0) {
        alert("Time's over");
        clearInterval("intervalHandle");
        document.getElementById("clock-time").style.display = "none";
        document.getElementById("time-minutes").style.display = "inline";
        delete_cookie("date2");
        // Stop here?
}

    secondsRemaining--;
}