How to get input range during change with jquery?
You could listen to the change
/input
events:
Updated Example
The DOM
input
event is fired synchronously when the value of an<input>
or<textarea>
element is changed.
The
change
event is fired for<input>
,<select>
, and<textarea>
elements when a change to the element's value is committed by the user. Unlike theinput
event, the change event is not necessarily fired for each change to an element's value.
$(document).on('input change', '#slider', function() {
$('#slider_value').html( $(this).val() );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="range" id="slider" value="0.5" min="0.0" max="1.0" step="0.01" />
<br />
<span id="slider_value"></span>
I'm sure listening to the input
event alone would suffice too.
In modern browsers you can use the input
event:
$(document).on('input', '#slider', function() {
$('#slider_value').html( $(this).val() );
});
Note that IE < 9 does not support it but neither does it support range
input
Reference: MDN input - Event
DEMO