使用jQuery启动时重置计时器

时间:2019-11-29 14:04:16

标签: jquery timer counter

我想使用jQuery在启动按钮上启动计时器。

我的代码运行正常,但是当我单击开始按钮两到三次时,它运行很快,而不是正常运行。我需要的是,当我单击开始按钮时,它将重置时间并再次启动计数器。在此代码中,“重置”按钮可以正常工作,但我希望通过单击“开始”按钮可以完全正常工作。

这里是代码

var interval;
var minutes = 5;
var seconds = 10;

function countdown(element) {
  interval = setInterval(function() {
    var el = document.getElementById(element);
    if (seconds == 0) {
      if (minutes == 0) {
        alert(el.innerHTML = "countdown's over!");
        clearInterval(interval);
        return;
      } else {
        minutes--;
        seconds = 60;
      }
    }
    if (minutes > 0) {
      var minute_text = minutes + (minutes > 1 ? ' minutes' : ' minute');
    } else {
      var minute_text = '';
    }
    var second_text = seconds > 1 ? 'seconds' : 'second';
    el.innerHTML = minute_text + ' ' + seconds + ' ' + second_text + ' remaining';
    seconds--;
  }, 1000);
}
<div id='countdown'></div>
<input type="button" onclick="countdown('countdown');" value="Start" />
<input type="button" onclick="minutes=5;seconds=10;" value="Reset" />

0 个答案:

没有答案