时间戳

首页 > 解决方案 > 如何让计时器在点击 Javascript 时停止

javascript - 如何让计时器在点击 Javascript 时停止

问题描述

我正在尝试在 javascript 中创建一个计时器。我希望计时器在点击时停止，但不会。我有两个参数：“开始”和“停止”。如果在计时器已经运行时单击开始按钮，我希望我的程序重新启动计时器，并在单击停止按钮时停止。

function timer(start, stop) {
let count;
if (start) {
    let count = 0;
    setInterval(() => {
        count++;
        console.log(count);
    }, 1000);
}
if (stop) {
    count = count;
}

}

标签： javascripthtml

解决方案

只需clearInterval在计时器运行时停止计时器，如果在不运行时单击，则重新设置。像这样的东西：

var timer;
var running = false;
var elapsed = 0;
var div = document.getElementById('time');
document.getElementById('btn').addEventListener('click', function() {
    if (running) {
        clearInterval(timer);
        running = false;
    } else {
        timer = setInterval(function() {
            elapsed++;
            div.textContent = elapsed;
            }, 1000);
        running = true;
    }
});
<button id="btn">Click Me</button>
<div id="time"/>

推荐阅读