Question

我有一个setInterval来循环动画，每次递归之间有一个延迟队列首先执行延迟然后执行功能，所以第四个是否可以在页面加载后立即启动动画，然后延迟？
我知道animate()有一个强制queue参数，但是在插件内部触发（animate()内部的函数）触发，但不是定时器（setInterval）。
这是动画的 sample

setInterval(function() {
  $('div').animate({
      marginLeft: '+=150px'
    }, 800,
    function() {
      $(this).animate({
        marginLeft: '-=150px'
      }, 800)
    })
}, 3000)

我不想开始一个新问题，但由于它是相关的，我在此 question 中找到了，我可以使用setTimeout循环，这是更好的因为当您更改标签并切换回来时会出现错误，因此元素会变得混乱这使我能够控制此 update 中的queue 除了无论多少改变值，都不能设置延迟这是应用queue参数后的最后一个 update ，我预计会立即工作然后应用延迟，但无法设置延迟

Answer 1

也许像

//first we create the function and give it a name (so it can be re-called)
//we then wrap it in parentheses and invoke it with () so it fires immediately (this is an IIFE)
(function loop () {
    //animate right
    $('div').animate({ marginLeft: '+=150px' }, 800, function() {
        //when the animate right is done, animate back left
        $(this).animate({ marginLeft: '-=150px' }, 800, function(){
            //setTimeout wants a function to invoke and a duration to wait until doing so
            //we give it 'loop' which is the name of our function so it will be re-used, thus creating the complete animation loop
            setTimeout(loop, 3000);
        });
    });
})();

更多参考：https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setTimeout

再谈一下功能性的东西。说你有以下......

function sayDog () { console.log('dog'); }
function sayCat () { console.log('cat'); }

这两个是函数定义。他们的实际逻辑在你打电话给他们之前不会执行。

sayDog(); <-- invoke sayDog
sayCat(); <-- invoke sayCat

但是在javascript中，这些名称只是变量。我们可以很容易地将它们定义为......

var sayDog = function () { console.log('dog'); }
sayDog();

结果相同。现在让我们看一下setTimeout。 setTimeout的目的是在一段时间内延迟函数的执行。所以说你有这个......

setTimeout(sayDog(), 1000);

你会期望sayDog在执行前等待1000。但你用（）明确地执行了它，所以它没有等待。作为旁注，如果sayDog没有返回另一个函数来执行它，则setTimeout在1000之后将无法执行任何操作。

function printPet (petFunction) { petFunction(); }
printPet(sayDog);
printPet(sayCat);

将函数引用传递给其他函数是完全有效的。上面有printPet接受任何给它并调用它。它还会导致调用sayDog和sayCat。

排队setInterval

1 个答案: