Question

为什么这段代码同步工作？

$this.animate( { 'left': '+=200px' } );
$this.animate( { 'top' : '+=200px' } );

我真的怀疑可以在JavaScript中同步执行一个函数。

和

doSomething();
doSomethingMore();

function doSomething() {
    setTimeout(function() {
        alert('doSomething finished');
    }, 3000);
}

function doSomethingMore() {
    setTimeout(function() {
        alert('doSomethingMore finished');
    }, 1000);
}

如何在函数doSomething完成之前不执行函数doSomethingMore。或类似的东西。

谢谢。

Answer 1

我想在这里猜一下，因为我也不能遵循jQuery源代码。：）

.animate()将动画添加到队列中。默认情况下，这是$.fx。将项目添加到队列时：如果是第一个，则运行该项目;如果不是，则等待直到它是队列中的第一个项目。一旦jQuery完成了动画的运行，它就会从队列中删除第一个项目（即刚刚完成的动画），然后运行第二个项目。
因此，只有似乎才能同步运行。如果在第二次调用.animate()之后再添加另一个语句，您将看到它实际上是立即执行的。这也是.animate()进行回调的原因。

还有其他功能可以让您操作队列。例如.stop()和.queue()。

Answer 2

您正在调用该方法两次，因此它将按照当前正在工作的方式进行操作，以便您可以在一次调用中按照您希望的方式工作：

$this.animate({left: '+=200px',top : '+=200px'});

为什么jQuery.animate是同步的？

2 个答案: