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.