19

今天，当我.animate()在它的选项中阅读 jQuery 方法的新功能时，我遇到了两个我认为具有相同作用的选项。

这些选项是done和complete。根据文档，它们是动画完成时运行的函数。

complete
Type: Function()
A function to call once the animation is complete.

和 ：

done
Type: Function( Promise animation, Boolean jumpedToEnd )
A function to be called when the animation completes (its Promise object is resolved). (version added: 1.8)

现在我的问题是两者之间有什么区别？

4

3 回答 3

4

JQuery 使用 promise，这意味着在完成时 JavaScript 可以从 promise 转到下一个函数。

假设您编写了 go to foo 和 go to bar 函数。无论第一个是否完成，JQuery 都会在第一次开始执行后开始第二个。

所以当你实现promise时，它会等待previous完成。

最后，在您的情况下，完成后将调用完成:)。因此，如果您想在动画完成后处理并在第一个技巧完成时再次执行一些技巧，请将其完整写入。

于 2015-02-06T10:25:33.257 回答
2

done() 在整个 jQuery 中是全局的，并且会根据正在完成的 Promise 中的所有事件触发，无论它们是排队的还是异步的。

在 jquery 的网站上查看承诺：jQuery Promise

文档中的示例：

var effect = function() {
  return $("div").fadeIn(800).delay(1200).fadeOut();
};

$("button").on("click", function() {
  $("p").append(" Started... ");

  $.when(effect()).done(function() {
    $("p").append(" Finished! ");
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>

于 2013-07-11T22:39:30.970 回答
0

♠♠简短回答：

您在完成中编写的所有代码（异步与否）首先运行，当它们完成时，完整的代码将运行

您还可以在完成函数中使用两个参数，而完整函数不接受任何参数

♠♠详细解答：

完成和完成有两个区别：

1-完成具有完成时间优先权，因此您在完成中编写的所有代码（异步或非异步）首先运行，当它们完成时，完成的代码将运行

例如，在下面的代码（jsFiddle）中，我们有一个动画，它同时具有 done 和 complete 函数，当动画完成时，done函数使 div 的背景颜色为蓝色，而complete函数使 div 的背景颜色为红色：

$.noConflict();
jQuery(document).ready(function ($) {
    $('#d_1').click(function () {
    $(this).animate
    (
        {
        width: '200px'
      },
      {
        duration: 800,
        complete: function () {
            $(this).css({
                    backgroundColor: 'red'
                });
        },
        done: function () {
            $(this).css({
                    backgroundColor: 'blue'
                });
        }
      }
    )
  });
})

如您所见，最终的背景颜色是红色，它是在完整功能中设置的。

2- done 和 complete 是函数，但 complete 不能接受任何参数，而 done 可以有两个参数（来自jQuery 文档）：

完毕

类型：函数（Promise 动画，布尔 jumpedToEnd ）

当元素上的动画完成（其 Promise 对象已解析）时要调用的函数。（添加的版本：1.8）

“promise 动画”与 jQuery 动画的“fx”原型相同，“jumpedToEnd”是一个辅助参数，表示如果动画被中断或不成功（其 Promise 对象被拒绝），它会自动跳转到结束。

于 2018-08-17T11:58:05.943 回答