Блог

Я использую функцию jQuery animate в плагине одновременно для многих элементов с разной длительностью для каждого элемента. Я хочу знать, запущена ли какая-либо анимация или анимации вообще нет. Итак, я придумал это:

 if( $div1.is(':animated') || $div2.is(':animated') || $div3.is(':animated') ) return true;
else return false;
  

или это:

 if( $div1.add($div2).add($div3).is(':animated') ) return true;
else return false;
  

Что лучше???

Знаете ли вы какой-либо другой метод???

Мне не нужен этот код $("*").is(':animated'); , потому что он будет проверять все анимации и анимации из других плагинов.

Имейте в виду, что у меня много элементов, а не только 3.

Спасибо за чтение…

Я бы выбрал второе, поскольку это требует меньше кода для чтения и обдумывания.

Как правило, DRY лучше.

Вы также могли бы провести рефакторинг этого…

 return $div1.add($div2).add($div3).is(':animated');
  

Возможно, вы могли бы поместить класс в divs, которые вы хотели бы проверить на анимацию?

 if ($(".myclass").is(":animated")) return true;
  

Я бы, вероятно, оставил это явным, чтобы сэкономить циклы. Каждый раз, когда вы анимируете, увеличивайте numberOfTotalAnimations . В конце обратного вызова анимации уменьшите его. Это если вам действительно нужна скорость здесь. В остальном, мне нравится предложение класса @Ben’s.

ОБНОВИТЕ примером по запросу:

 var numberOfTotalAnimations = 0;

numberOfTotalAnimations  ;
$('#thing').animate({
    opacity: 0.1
  }, 2000, function() {
    numberOfTotalAnimations--;
  });

if (!numberOfTotalAnimations) {
  console.log("Everything's quiet.");
} else {
  console.log("Something's moving.");
}
  

Это некрасиво, это подвержено ошибкам (в том смысле, что вы можете забыть увеличить или уменьшить счетчик), но это быстро.