简体   繁体   中英

Get jQuery two-handle slider value

I have the following HTML and JS structure for using the jQuery two-handle range slider:

.html

<p>
  <input class="amount" readonly style="border:0; color:black; background: transparent; text-align: center;" type="text">
</p>
<div class="slider-range"></div>

.js

$(function() {
  $(".slider-range").slider({
    range: true,
    min: 0,
    max: 1000,
    values: [0, 1000],
    slide: function(event, ui) {
      $(".amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
    }
  });
  $(".amount").val("$" + $(".slider-range").slider("values", 0) +
    " - $" + $(".slider-range").slider("values", 1));
});

I think I need to add a value="..." to my <input> element, but how do I capture the value range from the two sliders according to my JavaScript code? Thanks !

The values can be extracted as:

var minimum_val = $(".slider-range").slider("values",0)
var maximum_val = $(".slider-range").slider("values",1)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM