Bootstrap-slider显示表单字段

Question

我正在尝试实现一个滑块，但前提是只显示一个输入字段。

  

https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js

     

https://github.com/seiyria/bootstrap-slider

     

http://seiyria.com/bootstrap-slider/

我已添加：

bootstrap-slider.js
bootstrap-slider.css

除了一小块JS之外还有什么呢？

<script type="text/javascript">
$('#ex1').slider({
    formatter: function(value) {
        return 'Current value: ' + value;
    }
});
</script>

代码本身？

<input id="ex1" data-slider-id="ex1Slider" type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/>

请指教？

JS Fiddle

Answer 1

您需要包含jQuery，在包含bootstrap-slider.js

之前添加它

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

在初始化滑块之前，您还需要等待jQuery

<script type="text/javascript">
  $(document).ready(function() {
    $('#ex1').slider({
      formatter: function(value) {
        return 'Current value: ' + value;
      }
    });
  });
</script>