Как end () работает для animate ()? - PullRequest
Новая
       16

Как end () работает для animate ()?

0 голосов
/ 27 апреля 2011

В настоящее время я ищу цепочку моего кода jquery. Элемент должен окаймлять границу, анимированный. Мое решение: анимировать borderWidth на ноль, а затем удалить класс: 

$(".imgWrap", element).animate({ borderWidth: "0px" }).end()
    .removeClass("border");

animate () должен возвращать завернутый элемент, но, как я понимаю из API jQuery, end() вернет объект в его состояние до вызова .find.

.find находится в контексте примера, поэтому я позволил себе заменить его на .animate. Увы, это не работает для меня. Результат .end() является результатом .animate().

Ответы [ 2 ]

1 голос
/ 27 апреля 2011

.end() возвращает объект jQuery в его состояние до .find()

, т.е. если я сделаю это: 

$('div').find('.class').end()

, то что останется после объединениярезультат $('div').Это ничего не меняет в самих элементах.

Объект jQuery, возвращаемый большинством методов jQuery, не только содержит текущие совпадающие элементы, но также содержит стек результатов предыдущих вызовов в цепочке.

Следовательно, когда вы вызываете .find(), предыдущий список все еще сохраняется в этом стеке.Вызов .end() просто удаляет последний элемент из стека.

Чтобы исправить вашу реальную проблему (т. Е. Изменить стиль после анимации закончился), вам нужно поместить это изменение в complete параметр функции обратного вызова до .animate(). 

$(".imgWrap", element)
   .animate({ borderWidth: "0px" }, function() {
       $(this).removeClass("border");
   });
1 голос
/ 27 апреля 2011

Поскольку у вас (сейчас) нет фильтра find (или любого другого фильтра), end нечего отменить. Это не имеет ничего общего с animate.

Если бы вы сначала выбрали контейнер, а затем искали в нем imgWrap, вы можете отменить фильтр:

$('.container').find('.imgWrap').animate({borderWidth: '0px'}).end();

Вышеприведенное вернет элементы, соответствующие $('.container'), поскольку find равно отменено на end

Что может сбивать с толку, так это то, что если вы включите removeClass сразу после animate, removeClass не будет ждать окончания animate, поэтому будет казаться, что анимация не происходит. Вам нужно удалить класс в complete функции animate: 

$(".imgWrap", element).animate({ borderWidth: "0px" }, function(){
    $(this).removeClass('border');
});
...