javascript - 如何在 javascript/Jquery 中重置计时器？

Question

我有一个计时器，它在我的应用程序加载时启动。但我想通过单击按钮重置计时器。但是当我尝试重置计时器时，计时器部分开始显示奇怪的值。

请在下面找到我的代码:

HTML:

    <font size="4"><span class="myClass" id="time">02:00</span></font>   
<button onclick="myFunction()">Click me</button> 

Javascript:

$( document ).ready(function() 
            {
                var minute = 60 * 2,
                display = document.querySelector('#time');
                begin(minute, display);

            });


function myFunction()
{
var minute = 60 * 2,
display = document.querySelector('#time');
begin(minute, display);

}

    function begin(duration, display) {
                var timer = duration, minutes, seconds;
                setInterval(function () {
                    minutes = parseInt(timer / 60, 10)
                    seconds = parseInt(timer % 60, 10);

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

                    display.textContent = minutes + ":" + seconds;

                    if (--timer < 0) 
                    {
                        timer = duration;
                    }
                }, 1000);
            }

Answer 1

我认为您同时运行多个间隔，因此您需要使用clearInterval(interval); 清理它们；

$( document ).ready(function() 
        {
            var minute = 60 * 2,
            display = document.querySelector('#time');
            begin(minute, display);

        });
var interval;

function myFunction()
{
var minute = 60 * 2,
display = document.querySelector('#time');
clearInterval(interval);
begin(minute, display);
}

function begin(duration, display) {
            var timer = duration, minutes, seconds;
            interval = setInterval(function () {
                minutes = parseInt(timer / 60, 10)
                seconds = parseInt(timer % 60, 10);

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

                display.textContent = minutes + ":" + seconds;

                if (--timer < 0) 
                {
                    timer = duration;
                }
            }, 1000);
        }

类似这样的东西。