jQuery to change value of bootstrap-slider

Question

I have the following HTML slider script for making a Bootstrap slider:

<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>

A template can be seen on Example 19 of this Bootstrap-slider page .

How can I manually change the slider via jQuery ?

I noticed that when a new point is chosen on the slider, there is a lot of HTML and CSS content that changes, too. This means that I can't simply do something like

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

because all that does is change the literal value but nothing visually.

Answer 1

您应该先阅读文档 ，然后再使用setValue函数：

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