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

Question

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

Код и тестовый пример приведены в скрипте: 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');
        }
    });
}

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

Answer 1

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

Использовать slide событие из jQuery UI:

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

    }
});

...