具有任意捕捉点的范围滑块

时间:2012-01-04 15:05:10

标签: jquery jquery-ui slider jquery-ui-slider

我在我正在构建的网页上实现了jQuery range slider,但似乎无法将其捕捉到特定的非均匀分布值。有没有人知道这是否可以使用jQuery滑块,或者是否有我可以使用的替代?

作为一个更具体的例子,假设我的范围从0到100,并且我有一个像[0, 7, 32, 61, 67, 90, 100]这样的数组。我希望范围滑块只能选择数组中的值。

1 个答案:

答案 0 :(得分:4)

您可以使用slide callback来限制允许的位置:

  

在幻灯片播放期间每次鼠标移动时触发。事件中提供的值ui.value表示句柄将由于当前移动而具有的值。取消事件将阻止句柄移动,句柄将继续具有其先前的值。

所以你只需要这样的东西:

var allowed = { 0: true, 7: true, /*...*/ 100: true };
$("#slider").slider({
    //...
    slide: function(event, ui) {
        if(!allowed[ui.value])
            return false;
    }
});

allowed为否定时,您还可以使用return falseallowed.indexOf(ui.value)的数组;我认为使用对象会更好。

演示:http://jsfiddle.net/ambiguous/eRtBa/