jQuery改变bootstrap-slider的值

Question

我有以下HTML滑块脚本来制作 Bootstrap 滑块：

<div class="slider-div">
     <input id="ex19" type="text"
          data-provide="slider"
          data-slider-ticks="[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]"
          data-slider-ticks-labels='["0mm", "1mm", "2mm", "3mm", "4mm", "5mm", "6mm", "7mm", "8mm", "9mm"]'
          data-slider-min="1"
          data-slider-max="9"
          data-slider-step="1"
          data-slider-value="0"
          data-slider-tooltip="hide"
     />
</div>

可以在此Bootstrap-slider page的示例19 上看到模板。

如何通过 jQuery 手动更改滑块？

我注意到，当在滑块上选择新点时，会有很多 HTML 和 CSS 内容发生变化。这意味着我不能简单地做一些像

这样的事情

$('.slider-handle').attr('aria-valuenow', 7);

因为所有这一切都改变了文字值，但没有任何视觉效果。

Answer 1

您应首先阅读documentation，然后使用setValue功能：

$('#ex19').slider('setValue', 7);