slideDown callback выполняется много раз

374
24 августа 2017, 21:05

Есть jQuery-объект block, состоящий из нескольких элементов. К объекту применяется функция slideDown(), после выполнения которой, для всех элементов объекта должно произойти действие. Привожу пример кода, отражающего суть:

var block = $('.class');
var length = block.length //35
block.slideDown(500, function () {
  console.log('done');
});

В итоге 'done' выводится 35 раз, как сделать так чтобы выводилось 1 раз, после выполнения slideDown() для всех блоков?

Answer 1

var block = $('.class'); 
 
$.when(block.slideDown(500)).then(function() { 
  console.log('done'); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div> 
<div class="class"></div>

Answer 2

Возможно есть какой-то более логичный вариант, но с ходу в голову не пришел:

var block = $('.class');
var length = block.length //35
block.each(function( i ) {
  $(this).eq(i).slideDown(500, function () {
    if(i + 1 === length) console.log('done');
  });
});

Ну или так:

var block = $('.class');
var length = block.length //35
block.slideDown(500, function () {
  if($(this).index() + 1 === length) console.log('done');
});
READ ALSO
Посоветуйте слайдер

Посоветуйте слайдер

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

278