В чем разница между выполненными и полными параметрами метода анимации jquery
Сегодня, когда я читал новые возможности метода jQuery .animate()
, в вариантах я столкнулся с двумя вариантами, которые, по моему мнению, имеют такое же действие.
Эти параметры 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)
Теперь мой вопрос в чем разница между этими двумя?
Ответы
Ответ 1
JQuery использует обещание, которое означает, что во время выполнения JavaScript может перейти к следующей функции из обещания.
Скажем, вы написали, перейдите в foo и перейдите к функциям бара. JQuery начнет второй после первого запуска, независимо от завершения первого.
Поэтому, когда вы выполняете обещание, оно будет ждать завершения выполнения.
Наконец, в вашем случае завершение будет вызываться, как только сделано сделано:). Поэтому, если вы хотите обработать, как только анимация будет завершена, и снова сделайте несколько трюков, когда первый трюк будет завершен, напишите его в полном объеме.
Ответ 2
done() является глобальным по всему jQuery и срабатывает на основе всех событий в завершении обещания, независимо от того, находятся ли они в очереди или асинхронно.
Отметьте promises на веб-сайте 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>