Jquery Chaining vs Callbacks

Question

Для jQuery, в чем разница в следующих двух фрагментах. Что-нибудь? Верно ли, что обратный вызов и второй элемент в цепочке выполняются по завершении первой анимации?

$(selector).animate({ opacity: 1 }).animate({ opacity: 0.5 });

против

$(selector).animate({ opacity: 1}, function()
{
    $(this).animate({ opacity: 0.5 });
});

В каких ситуациях я хотел бы использовать один над другим? Буду ли я использовать последнее, только если мне нужно будет сделать что-то более сложное или переключиться на другой селектор?

Заранее спасибо.

Answer 1

Они фактически одинаковы, поэтому вы, вероятно, просто используете первое.

Обратные вызовы (вторая версия) предназначены для запуска любого произвольного кода, который не ставится в очередь автоматически.

Это включает и другие методы jQuery, например .css(), которые, если их нет в обратном вызове, будут выполняться задолго до завершения анимации.

// .animate() is automatically queued
$(selector).animate({ opacity: 1 }).animate({ opacity: 0.5 });

---

// .css() is not automatically queued, so you'd need a callback
$(selector).animate({ opacity: 1 }, function() {
    $(this).css({ opacity: 0.5 });
});

---

Без обратного вызова...

 // Animation starts ----v
$(selector).animate({ opacity: 1 }).css({ opacity: 0.5 });
 // ...but .css() runs immediately-------------^
 // ...because it isn't automatically added to the queue.

Answer 2

Единственная разница заключается во времени: обратный вызов во втором примере не будет выполнен, пока не завершится первая анимация.Цепная анимация в первом примере произойдет сразу после начала первой анимации.