обратный вызов jquery после каждой итерации

Question

обратный вызов jquery после каждой итерации

0

 $.each(mappings, function(key, item) {
        if (match(selected_values, item)) {
          $(key).show("slow");
        } else {
          $(key).hide("slow");
        }
    });

    //At this point, all items are still visible!
    var item_count = $('.item').filter(':visible').length;
    if (item_count < 12) { 
        $('.item').not(':visible').slice(0,12 - item_count).show();
    }

Я повторяю структуру данных, и в зависимости от некоторых выбранных атрибутов некоторые элементы скрыты, другие показаны.

Проблема заключается в том, что клиент запрашивает видимые минимальные элементы. Поэтому, даже если фильтрация работает правильно, и я получаю несколько 3 видимых элементов, они должны быть дополнены еще 9 элементами, поэтому показывается не менее 12.

Теперь, после каждой итерации, кажется, что функции .show() и .hide() еще не завершены. Как и где я могу правильно применять функции заполнения?

Я проверил Вызов функции jQuery после завершения.each(), но он применяет эту функцию после каждого .show() или .hide(), чего я не хочу (это не нормально, чтобы пропустить во время итерации, сначала необходимо скрыть все, которые не применяются).

Это одно: выполнить обратный вызов после jquery, каждая итерация не работает, когда функция вызывается, у меня такая же проблема (show() и hide() не завершены).

EDIT: Я только выяснил, что удаление атрибута "slow" в .show() и .hide() решает проблему. Итак, что, если я хочу сохранить анимацию?

faboolous 03 дек. 2013, в 02:24

Источник

0

Да, я только что узнал и отредактировал мой вопрос. Это анимация. Спасибо
faboolous 03 дек. 2013, в 00:30

Теги:

javascript

jquery

each

visible

2 ответа

0

Вы можете получить хорошие результаты, просто добавив .stop() в цепочку:

$('.item').not(':visible').slice(0,12 - item_count).stop().show();

Любая ранее инициированная анимация (show/hide) будет остановлена, и элемент будет показан только.

maackle 02 дек. 2013, в 22:45

0

Выглядит как элегантный ответ, но на самом деле это не сработало
faboolous 03 дек. 2013, в 00:42

Ещё вопросы

Да, я только что узнал и отредактировал мой вопрос. Это анимация. Спасибо
Выглядит как элегантный ответ, но на самом деле это не сработало

adeneo · Accepted Answer · 2013-12-02T22-09-00.000Z

Он синхронный, поэтому вам не нужен обратный вызов, но у вас асинхронная анимация, и это реальная проблема. Просто используйте счетчик в цикле вместо проверки длины элементов или добавьте класс:

$.each(mappings, function(key, item) {
    if (match(selected_values, item)) {
      $(key).addClass('selected').show("slow");
    } else {
      $(key).hide("slow");
    }
});

if ($('.item.selected').length < 12) { 
    $('.item').not('.selected').slice(0,12 - item_count).show();
}

Мне нравится добавление решения класса. должно быть быстрее, чем фильтрация видимых (?). Конечно, мне также пришлось добавить соответствующий removeClass до того, как снова начнется фильтрация.