如何使用延迟jQuery停止循环计时器

时间:2016-06-10 10:39:53

标签: javascript jquery loops timer delay

我做了一个每10秒有一个延迟的循环。我设定了一个计时器10秒。但它不会在3循环后停止......任何想法?我做错了什么?在2循环之后我正在检查它是否是3d循环我正在清除间隔但是你可以看到它不清楚? 到目前为止我做了什么:https://jsfiddle.net/56n720qm/2/

jQuery(document).ready(function() {

var i = 0;
var intervaltime;
var fiveMinutes = 10 * 1;
var display = document.querySelector('#timer');

function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    intervaltime = 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);
}
function stopINT(){
    clearInterval(intervaltime);
}
function myLoop () {
    if(i > 0){time = 10000;}else{time=0;} //every 10 s.
    setTimeout(function () {
        //postFB(i);
        //alert(i);
        i++;
        if(i == 3){
            stopINT();
        }
        if (i <= 2) {
            startTimer(fiveMinutes, display);
            myLoop();
        }
    }, time)
}
myLoop();
});

1 个答案:

答案 0 :(得分:2)

您在没有清除第一个区间的情况下开始新的区间,因此在一个点上同时运行多个区间。

在此处添加行clearInterval(intervaltime);以解决您的问题。

  if (i <= 2) {
      clearInterval(intervaltime);
      startTimer(fiveMinutes, display);
      myLoop();
  }

检查the fiddle

此外,您可能需要考虑将变量时间从10000更改为11000,以防止循环过早完成。