Question

我在页面中有两个范围滑块来定义低范围和高范围值

当我选择低范围时，高范围滑块最小值应从低范围滑块最大值开始。任何想法我怎么能这样做？我在下面提到了我的代码

<div id="lowRangeSlider" class="rangeSlider" style="width: 500px; margin: 10px;">
<input type="hidden" />
<input type="hidden" />
</div>

<div id="highRangeSlider" class="rangeSlider" style="width: 500px; margin: 10px;">
<input type="hidden" />
<input type="hidden" />
</div>

使用Javascript：

$("#lowRangeSlider").kendoRangeSlider({
        min: 0,
        max: 100,
        smallStep: 1,
        largeStep: 5,
        tickPlacement: "both",
        change: function (e) {
            $("#lowMinValue").val(e.value[0]);
            $("#lowMaxValue").val(e.value[1]);
        }
    });
    var lowRangeSlider = $("#lowRangeSlider").data("kendoRangeSlider");

$("#highRangeSlider").kendoRangeSlider({
        min: 0,
        max: 100,
        smallStep: 1,
        largeStep: 5,
        tickPlacement: "both",
        change: function (e) {
            $("#highMinValue").val(e.value[0]);
            $("#highMaxValue").val(e.value[1]);
        }
    });
    var highRangeSlider = $("#highRangeSlider").data("kendoRangeSlider");

Answer 1

来自Telerik的官方论坛：

目前没有此类功能可用。我建议在Kendo的UserVoice中提交您的请求，以便其他成员社区可以评估，评论和投票。

但是，上一篇文章[{3}}

中似乎有一些解决方法

Answer 2

我设法通过这种方式来更新滑块：

$("#slider").kendoRangeSlider({
    min: 10,
    max: 100
});

var slider = $("#slider").data("kendoRangeSlider");
slider.setOptions({
    min: 10,
    max: 500
});
slider.value([10, 500])
slider.resize();

slider.resize();再次重新渲染滑块。

如何在初始化后设置Kendo范围滑块的最小值和最大值

2 个答案: