0

範囲が 1 ~ 100 の jQuery UI Slider があります。1〜100の値ごとにdivのクラスを変更したい。

1 から 100 までのすべての値を最も効率的に調べ、すべての値に対して新しいクラスを切り替えるにはどうすればよいですか?

答え(これが最終的にうまくいったものです):

$( '#slider-container' ).slider({
min: 1,
max: 100,

slide: function() {

    var $activeBackgroundUrl = $('.position_100').css('background');


    return function(event, ui) {
        activeBackgroundUrl = 'url(images/numbers/1'+(ui.value < 10 ? '0' : '')+ ui.value +'.png)';
        $('.position_100').css('background', activeBackgroundUrl);
    };

}()

});
4

1 に答える 1

0

クロージャーを使用してキャッシュしてみてくださいdiv。このようにして、すべてのslideイベントで DOM が照会されるわけではありません。代わりに、 yourdivは 1 回だけ照会および定義されます。

$('#slider-container').slider({
    min: 1,
    max: 100,
    slide: (function() {
        var $el = $('#myDiv'),
            activeClass = '';

        return function(e, ui) {
            $el.removeClass(activeClass);
            activeClass = 'number_1' + (ui.value < 10 ? '0' : '') + ui.value;
            $el.addClass(activeClass);
        };

    })();
});
于 2012-08-07T21:06:09.873 に答える