Question

所以，基本上我有三个功能，我希望它们一个接一个地运行，延迟两秒。

我希望实现以下目标：

firstFunction();
// Two seconds delay
secondFunction();
// Two seconds delay
thirdFunction();
// Two seconds delay
firstFunction();

等等。我尝试使用setInterval，setTimeout，jquery延迟，到目前为止我没有实现任何东西 - 在最佳情况下，所有三个函数同时运行。确切地说，这三个函数的代码非常相似

var active = $(".active.two").removeClass('active');
if (active.next('img') && active.next('img').length) {
    active .next('img').addClass('active');
} else {
    active.siblings(":first-child").addClass('active');
}

如果你能告诉我正确的方向，我将不胜感激。

Answer 1

您可以使用setInterval来实现此目的。您可以通过将函数的引用存储在数组中然后依次调用它们来简化它。试试这个：

function funcOne() {
    console.log('one');
}

function funcTwo() {
    console.log('two');
}

function funcThree() {
    console.log('three');
}

var i = 0;
var funcs = [ funcOne, funcTwo, funcThree ];
setInterval(function() {
    funcs[i % funcs.length]();
    i++;
}, 2000);

Example fiddle

Answer 2

假设您的函数是同步的，您希望在每个函数完成后使用setTimeout()计划对下一个函数的调用。以下示例将在每次调用之间调用每个函数，延迟时间为2秒。

＆＃13;

function firstFunction() {
   $('#log').append('<p>First</p>');
}
function secondFunction() {
   $('#log').append('<p>Second</p>');
}
function thirdFunction() {
   $('#log').append('<p>Third</p>');
}

function callFunctions(function_list, delay) {
  function callNextFunc() {
    if (function_list.length) {
      var nextFunc = function_list.shift();
      nextFunc();
      setTimeout(callNextFunc, delay);
    }
  };
  callNextFunc();
}

var function_list = [firstFunction, secondFunction, thirdFunction];
callFunctions(function_list, 2000);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="log"></div>

＆＃13;

延迟后在jQuery中运行函数

2 个答案: