Как я могу применить свою проверку, только если ползунок jQuery UI переместился?

0

Я пытаюсь создать набор фильтров с ползунками jQuery UI, чтобы пользователь мог их перемещать и отфильтровывать элементы на основе атрибутов данных, применяемых к объектам (в данном случае это время).

См. Скрипку для кода и тестового примера: http://jsfiddle.net/thecrumb/7Err4/1/

function doShowHideBadges() {
    //show all initially then loop through each
    $('div[id^="block"]').removeClass('hidden').each(function (e) {
        var sliderValue1 = $('.slider-range0').slider("option", "values");
        var sliderValue2 = $('.slider-range1').slider("option", "values");
        console.clear();
        console.log(sliderValue1[0] + '-' + sliderValue1[1] + ' | ' + sliderValue2[0] + '-' + sliderValue2[1]);
        if (
            ($(this).data('departuretime0') < sliderValue1[0] || $(this).data('departuretime0') > sliderValue1[1]) &&
            ($(this).data('arrivaltime0') < sliderValue2[0] || $(this).data('arrivaltime0') > sliderValue2[1])
        ) {
            $(this).addClass('hidden');
        } else {
            $(this).removeClass('hidden');
        }
    });
}

Я, наконец, работаю так, как хочу, но только если пользователь перемещает оба ползунка. Мне нужны объекты, которые должны отображаться/скрываться на основе любого из фильтров - не обоих.

  • 0
    Я проверил вашу скрипку. DoShowHideBadges () выполняется всякий раз, когда движок ползунка скользит.
Теги:
filter
show-hide
jquery-ui-slider

1 ответ

0

Почему вы боретесь с их api?

Используйте событие slide из пользовательского интерфейса jQuery:

$( ".slider-range0" ).slider({
    slide: function( event, ui ) {
        // show and hide functions in here

    }
});

...
  • 0
    Ты смотрел на скрипку? Я использую событие слайда - оттуда я вызываю doShowHideBadges ().

Ещё вопросы

Сообщество Overcoder
Наверх
Меню