0

我有这个功能:

var secondsRemaining = 45;

function countdown(secondsRemaining) {
var  seconds = secondsRemaining;
if (secondsRemaining > 0) {
 $('.timer > div').html(seconds);
 secondsRemaining--;
} else {
 if (secondsRemaining == 0) {
  // Times up ....
 }
 }
setInterval(function() {
countdown(secondsRemaining);
}, 1000); 
}

我正在 Document ready 函数中运行该函数:

 countdown(secondsRemaining);

在我点击答案后我再次运行它。问题是我现在有 2 个倒数计时器同时运行,新的计时器从 45 秒开始,旧的计时器从原来的位置继续。

4

2 回答 2

0

利用clearInterval()

首先,存储第一个的区间id setInterval()

var secondsRemaining = 45;

function countdown(secondsRemaining) {
var  seconds = secondsRemaining;
if (secondsRemaining > 0) {
 $('.timer > div').html(seconds);
 secondsRemaining--;
} else {
 if (secondsRemaining == 0) {
  // Times up ....
 }
 }
myinterval=setInterval(function() { //myint now contains the interval id
countdown(secondsRemaining);
}, 1000); 
}

现在,当用户单击时,在设置新间隔之前,使用以下命令取消第一个clearInterval()

button.onclick=function(){
  //do stuff
  clearInterval(myinterval)
  setInterval(function() {
    countdown(secondsRemaining);
   }, 1000); 
   // do stuff
}
于 2013-02-15T13:46:00.737 回答
0

抱歉,我不太明白您表达问题的方式似乎是说您有意启动两个时间事件,一个是在文档加载时,另一个是在您单击答案时,它们都输出到同一个元素。

如果问题是您希望它在两个不同的元素中输出,那么您可以传递可以使用的元素的参数:

countdown($('.pick-me'), secondsRemaining);

如果你想使用相同的元素,那么你总是可以清除每次点击的时间间隔,然后设置新事件的时间间隔,刚刚得到更新并看到 Manishearths 的响应,所以不会详细介绍它,因为这可能是您正在寻找的答案。

于 2013-02-15T13:50:04.503 回答