javascript - 在具有数据滑块的输入标签上调用 Jquery 函数

Question

我正在使用AdminLTE Bootstrap Admin Dashboard Template提供的现成模板。我在 html 页面上有以下滑块输入 & 想在滑块上调用 jquery 事件

<div class="price-range"><!--price-range-->
  <h2>Price Range</h2>
  <div class="well text-center">
    <input type="text" class="span2" value="" data-slider-min="0" data-slider-max="600" data-slider-step="5" data-slider-value="[250,450]" id="sl2" ><br />
    <b id="min" class="pull-left">$ 0</b>
    <b id="max" class="pull-right">$ 600</b>
  </div>
</div><!--/price-range-->

看起来像，

当我在其中滑动值时如何调用事件？

我尝试关注但不工作，

$(document).on('blur change click dblclick error focus focusin focusout hover keydown keypress keyup load mousedown mouseenter mouseleave mousemove mouseout mouseover mouseup resize scroll select submit', '#sl2', function() {
  alert("hii")
}); 

标签： javascriptjqueryhtmladminltebootstrap-slider

Answer 1

根据bootstrap-slider 文档，您必须处理“slideStop”事件。你已经为你准备了一个小提琴样本。

const slider = $('#ex1').slider({
  formatter: function(value) {
    return 'Current value: ' + value;
  }
});

slider.on('slideStop', function(e) {
  console.log('value = ' + e.value);
});