我有一个带有两个句柄的jQuery滑块。我希望根据第二个手柄将第一个锁定在适当的位置。

我尝试检查slide事件上的值,然后将第一个手柄设置回其锁定位置,但它基本上会忽略我将其设置为什么并继续滑动。

我已经将它与Stop事件一起使用,但是它非常笨拙。

我正在使用从服务器端生成的JSON对象来填充我的滑块。这是我的stop事件代码:

   $(clientID).slider({
        range: true,
        max: slider.max,
        values: [slider.minVal, slider.maxVal],
        change: afterSliderChanged,
        stop: onSliderStop
    });

    function onSliderStop(event, ui) {
    for (i in sliders.sliders) {
        var slider = sliders.sliders[i];
        var clientID = slider.cellType + "_" + slider.objectID + "_null";

        if (this.id == clientID) {
            if (ui.values[0].toString() == slider.max.toString()) {
                var values = $(this).slider('option', 'values');
                $(this).slider('option', 'values', [parseInt(slider.max - 1), parseInt(values[1])]);
            }
        }
    }


谁有想法?

让我知道是否需要详细说明。

谢谢!
丹尼尔·布鲁尔

最佳答案

这是一个简单又肮脏的示例,说明如何相对于被拖动的手柄锁定另一个手柄:

var offset = 40;
$('#slider').slider({
    range: true,
    max: 600,
    values: [40, 80],
    slide: function(e,ui){
        if (ui.value == ui.values[0]) {
            $(this).slider('values',1, ui.value+offset);
        } else {
            $(this).slider('values',0, ui.value-offset);
        }
    }
});


应该可以帮助您弄清楚该怎么做。

工作示例:http://jsfiddle.net/cBHdD/

08-05 08:41