Question

我正在使用jQRangeSlider 我想改变滑块的动态范围。当我选择一个Range值时，会自动初始化并设置一个选定的Range值。

我正在使用此代码。但似乎没有更改范围。我试过了。

jQuery代码：

$(document).ready(function(){
    $("#sliderShow").rangeSlider({
                bounds: {min: 0, max: 100},
                defaultValues:{min: 55, max: 95},
                range: {min: 5, max: false}
    });

    $("#margin").on("change", function(e, data){
                    var rangeChanged  = $(this).val();  
                    $("#sliderShow").rangeSlider({
                        bounds: {min: 0, max: 100},
                        defaultValues:{min: 55, max: 95},
                        range: {min: rangeChanged, max: false}
                    });
    });
});

HTML代码：

<div id="sliderShow"></div>                     
<div id="sliderSetOption">
    Range :
    <select id='margin'>
        <option value="5">5</option>
        <option value="10">10</option>
        <option value="15">15</option>
        <option value="20">20</option>
    </select>
</div>

Answer 1

不同之处在于创建了您已经完成的范围滑块，而不是在创建后更改值。查看您引用的文档：

 // Change options after slider creation
 $("#slider").rangeSlider("option", "bounds", {min: 10, max: 90});

因此，对于死区更改事件，您的代码看起来像这样：

 $("#deadband").on("change", function(e, data){
                            var rangeChanged  = $(this).val();  
                            $("#sliderShow").rangeSlider(
                                    "option",
                                    "range",
                                    {min: rangeChanged, max: false}
                            );
  });

jQRangeSlider使用HTML select更改Range值动态

1 个答案: