0

我对这个 StackOverflow 问题有类似的设计目标,即向JQuery 滑块添加标签,在用户拖动滑块时显示滑块的当前值。我对这些答案的问题是slide当滑块即将移动到新位置时触发事件,并为ui对象提供新值。很好,但是我能找到方法的唯一滑块位置是旧位置,而不是新位置。滑块上有足够的步数,这并不明显,但如果我减少步数,您会看到标签出现在滑动手柄曾经所在的位置旁边。

我已经从另一个问题更新了 jsFiddle 以说明问题:http: //jsfiddle.net/mcuf6/2/

那么,tl; dr:如何通过在滑动事件期间获取滑块句柄的最终位置来避免在用户拖动句柄时绘制滑块标签的滞后?

4

1 回答 1

2

编辑:这个小技巧应该完全符合您的需要

$(document).ready(function() {
    $("#slider").slider({
        value:0,
        min: 0,
        max: 5,
        step: 1,
        range: 'min',
        slide: function( event, ui ) {
            var that = $(this);
            setTimeout(function() {
            var offsetLeft = that.find(".ui-slider-handle").offset().left;
            $( "#sliderValue" )
                .val( ui.value )
                .css({
                    "position": "absolute",
                    "left": offsetLeft
                });
        },1);
        }
    });
});​

http://jsfiddle.net/mcuf6/6/

于 2012-11-13T13:44:23.660 回答