Question

我已经实现了bootstrap和jquery以及bootstrap jquery（https://github.com/seiyria/bootstrap-slider）。我正在使用示例6（http://seiyria.com/bootstrap-slider/）。我想得到这个值并在div中显示它（所以后来我可以创建一个带有该值的if），但我无法让它显示出来。这是我的HTML代码：

<div class="col-lg-6" style="height: 39px; padding: 10px; padding-left: 25px;>
    <input id="ex6" type="text" data-slider-min="10000" data-slider-max="100000" data-slider-step="1" data-slider-value="90000"/>
    <span id="ex6CurrentSliderValLabel">Maksimalna cena: <span id="ex6SliderVal">90000</span></span> din.
</div>
<div id ="ivancar"> test </div>

这是我的JavaScript（jQuery）代码：

var slider = new Slider("#slider1");
   slider.on("slide", function(slideEvt) {
   console.log(slider.getValue() );
   var div = slider.getValue();
});
document.getElementById("ivancar").innerHTML = div;

Answer 1

您已将div更新为slide事件之外的逻辑。将它放在幻灯片事件中。

 slider.on("slide", function(slideEvt) {
   console.log(slider.getValue() );
   var div = slideEvt.value; // this is what the plugin says
   $("#ivancar").html(div); // <== update logic must be here
});

注意：为简单起见，我将document.getElementById("ivancar").innerHTML = div;代码更改为$("#ivancar").html(div);

Bootstrap滑块 - 获取值并以div显示

1 个答案: