jquery ui 滑块停止选择最小值和最大值相同

Question

我正在使用 Jquery UI 滑块。我正在配置滑块形式 database.all 一切正常。

但我想停止最小最大值相同。

<div id="timeRangeSlider" class="slider"></div>
<div id="priceSlider" class="slider"></div>
<div id="areaSlider" class="slider"></div>

配置滑块：

timeRangeSliderConfig = {
    range: true,
    min: 0,
    max: model.TimeRanges.length - 1,
    values: [findIndex(model.TimeRanges, model.MinTime), findIndex(model.TimeRanges, model.MaxTime)],
    step: 1,
    change: function (event, ui) {
        // Set the real value into the inputs
        $('#fromTime').text(model.TimeRanges[ui.values[0]].Months + 'M');
        $('#toTime').text(model.TimeRanges[ui.values[1]].Months + 'M');
    }
};

比提前。

Answer 1

根据你的问题，我了解到你需要停止重叠滑块

以便您可以使用以下代码

//for class lavel for all sliders
$(".slider").slider({
        slide: function(event, ui) {
            if ( (ui.values[0] ) == ui.values[1] ) {
                return false;
            }
        }

    })

;

或

timeRangeSliderConfig = {
    range: true,
    min: 0,
    max: model.TimeRanges.length - 1,
    values: [findIndex(model.TimeRanges, model.MinTime), findIndex(model.TimeRanges, model.MaxTime)],
    step: 1,
    change: function (event, ui) {
        if ( (ui.values[0] ) == ui.values[1] ) {
                return false;
            }
        // Set the real value into the inputs
        $('#fromTime').text(model.TimeRanges[ui.values[0]].Months + 'M');
        $('#toTime').text(model.TimeRanges[ui.values[1]].Months + 'M');
    }
};

jquery ui 滑块停止选择最小值和最大值相同

jquery ui slider stop selecting min and max value same

jquery

uislider