javascript - 重置 'setIntervall' 计数器/删除现有实例

Question

计时器将从加载页面后 10 分钟开始倒计时。如果我在一段时间后按下鼠标，倒计时应该再次开始。但随后计时器将在两个值之间跳转。看来，两者都在算计。如何删除现有间隔？

Template.content.onRendered(function() {
    var display = document.querySelector('#timer');

    startTimer( 600, display);
});

Template.content.events({
    'mousedown': function() {
        var display = document.querySelector('#timer');
        startTimer( 600, display);
        // this will start a new counter
        // but I want the old one to be replaced
    }
});

startTimer = function(duration, display) {
    var start = Date.now(),
        diff,
        minutes,
        seconds;
    function timer() {
        diff = duration - (((Date.now() - start) / 1000) | 0);
        minutes = (diff / 60) | 0;
        seconds = (diff % 60) | 0;

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds; 
    }
    timer();
    setInterval(timer, 1000);
};

Answer 1

在 js 中添加一个新变量

var timer = 0;

更新 startTimer 函数中的代码

setInterval(timer, 1000);

至

timer = setInterval(timer, 1000);

然后在您的 mousedown 事件处理函数中，添加以下行

clearInterval(timer);