延迟后在jQuery中运行函数答案

【问题标题】：Running functions in jQuery after delay延迟后在jQuery中运行函数
【发布时间】：2015-06-23 08:24:21
【问题描述】：

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

我想达到这样的目标：

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');
}

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

【问题讨论】：

重复link
To be exact, code of these three functions are fairly similar >> 听起来确实像 XY 问题，您最好发布有关您预期行为的问题，而不是解决方法你认为会适合它。如果您只想在一个循环中将active 类设置为不同的元素，然后发布相关的 HTML 标记本身

标签： jquery function timeout delay intervals

【解决方案1】：

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

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);

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

【讨论】：

这个答案完全有效，但我找到了一个更简单的解决方案，但非常感谢！
@user3323095 够公平的。如果你有长时间运行的功能，那么这个答案和Rory的setInterval()之间会有区别；否则是的，他的要简单得多。

【解决方案2】：

您可以使用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

【讨论】：