引导滑块 - 分别显示上限和下限值

Question

我正在使用 bootstrap-slider.js (https://github.com/seiyria/bootstrap-slider) 来实现一个范围滑块，例如此处的示例 2 http://seiyria.github.io/bootstrap-slider/

我有滑块工作，但我不喜欢工具提示，而是希望在滑块的每一端显示上下值，当上下滑块移动时动态更新它们。我遇到的问题是滑块中的值以逗号分隔列表的形式出现 - 即 1,1000（上、下），所以我在滑块的每一端都得到了两个值。我需要在滑块左侧显示下限值，在滑块右侧显示上限值。

到目前为止，我已经使用以下代码使其工作，但它在滑块的每一端都显示了上限值和下限值。我已经尝试修剪这些值，但无法使其正常工作。谁能建议一种方法，我可以在滑块的任一端显示一个最大值/最小值？

我的代码：

HTML：

        <h4 id="search-slider-lower-value">£<span id="search-sliderLowerSliderVal">100</span></h4>
        <input id="search-slider" type="text" class="span2" value="" data-slider-tooltip="hide" data-slider-min="100" data-slider-max="1000" data-slider-step="5" data-slider-value="[100,1000]"/> 
        <h4 id="search-slider-upper-value">£<span id="search-sliderUpperSliderVal">1000</span></h4>         

jquery：

$("#search-slider").slider();
    $("#search-slider").on("slide", function(slideEvt) {
        $("#search-sliderLowerSliderVal").text(slideEvt.value);
        $("#search-sliderUpperSliderVal").text(slideEvt.value);
    });

Answer 1

这些值存储在一个数组中。

$("#search-slider").slider();
$("#search-slider").on("slide", function(slideEvt) {
    $("#search-sliderLowerSliderVal").text(slideEvt.value[0]);
    $("#search-sliderUpperSliderVal").text(slideEvt.value[1]);
});