Range slider - how to dynamically update slider value: - Javascript DOM Event

Javascript examples for DOM Event:oninput

  1. HOME
  2. Javascript
  3. DOM Event
  4. oninput

Description

The oninput event occurs when an element gets user input.

Summary

Bubbles Yes
Cancelable No
Supported HTML tags: <input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type="month">, <input type="number">, <input type="password">, <input type="range">, <input type="search">, <input type="tel">, <input type="text">, <input type="time">, <input type="url">, <input type="week"> and <textarea>

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<input type="range" oninput="myFunction(this.value)">
<p id="demo"></p>

<script>
function myFunction(val) {//ww  w. ja  va2  s .  com
    document.getElementById("demo").innerHTML = val;
}
</script>

</body>
</html>

Related Tutorials