jQuery UI滑块-最大值

我想使用jQueryUI滑块

我使用了以下代码：

            $( ".slider" ).slider({
                value:50,
                min: 0,
                max: 100,
                slide: function( event, ui ) {
                    $(this).parent().children('.leftColumn').css("width",ui.value+"%");
                    $(this).parent().children('.rightColumn').css("width",100-ui.value+"%");
                }
            });

我根据滑块的比例设置最小值和最大值。 但是我想再设置一个最小值和最大值，用户不能在滑块上跨越它们

---

有可能吗？

您应该使用最小最大值进行滑动，否则还有一个选项：

$( ".slider" ).slider({
            value:50,
            min: 0,
            max: 100,
            slide: function( event, ui ) {
                if( ui.value < 10 || ui.value > 30 ) 
                {
                    $(this).slider("value", (ui.value < 10 ? 10 : 30));
                    return false;
                }
                $(this).parent().children('.leftColumn').css("width",ui.value+"%");
                $(this).parent().children('.rightColumn').css("width",100-ui.value+"%");
            },
            stop : function(event, ui){
                if( ui.value < 10 || ui.value > 30 ) 
                {
                    $(this).slider("value", (ui.value < 10 ? 10 : 30));
                    return false;
                }
            }
        });

$（“.slider”）.slider({
价值：50，
分:0,，
最高：100，
幻灯片：功能（事件、用户界面）{
如果（ui.value<10 | | ui.value>30）
{
$（this）.slider（“value”，（ui.value<10？10:30））；
返回false；
}
$（this）.parent（）.children（'.leftColumn'）.css（“宽度”，ui.value+“%”）；
$（this）.parent（）.children（'.rightColumn'）.css（“宽度”，100 ui.value+“%”）；
},
停止：功能（事件、用户界面）{
如果（ui.value<10 | | ui.value>30）
{
$（this）.slider（“value”，（ui.value<10？10:30））；
返回false；
}
}
});

现场演示：