一个setTimeout循环,有两个间隔

时间:2018-05-16 18:50:50

标签: jquery

我有一个jquery超时函数,每13000ms循环一次。

$(function () {
var $anchors = $('.fader');

(function _loop(idx) {
  $anchors.removeClass('loading').eq(idx).addClass('loading');
  setTimeout(function () {
    _loop((idx + 1) % $anchors.length);
  }, 13000);
 }(0));
});

我一直试图找到为每个循环设置两个间隔的方法。第一个间隔是13000ms,第二个间隔是16000ms。我尝试设置两个定时器,但每个循环,它们变得更加不同步。有没有办法设置一个循环,在每个循环中以13000ms然后16000ms一致地添加/删除我的类?

3 个答案:

答案 0 :(得分:1)

好的,所以这个提议的解决方案应该在13000到16000之间来回切换延迟。



$(function() {
  var $anchors = $('.fader');
  var delay = 13000;

  function _loop(index) {
    setTimeout(function(){
      $anchors.removeClass('loading');
      $anchors.eq(index).addClass('loading');
      //flip the delay between 13000 and 16000
      delay += (14500 - delay) * 2;
      //go to the next anchor, wrapping on length
      _loop(++index % $anchors.length);
       //select the delay based on if it is an even or odd index
    }, delay);
  }
  
  _loop(0);
});




答案 1 :(得分:0)

如果我正确理解您的问题,我认为这是您的答案

let timer = 1000;

function f() {
  setTimeout(function() {
    console.log(timer + " passed!");
    if (timer == 2000) {
      timer = 1000;
    } else {
      timer = 2000;
    }
    f();
  }, timer);
}

f();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

答案 2 :(得分:0)

let loop_count = 0;
const timer = 13000;
window.$anchors;

$(function(){
    $anchors = $('.fader');
    _loop();
})

function _loop(){
    loop_count++;
    $('.fader')
        .removeClass('loading')
        .eq(loop_count)
        .addClass('loading');
    setTimeout(
        _loop,
        loop_count?timer:timer+3000
    );
}