Getting range input?

How do I get the values from range inputs and display them? https://code.sololearn.com/Wixe86wt1l59/?ref=app You can edit this however you need to. I understand all of the html involved with range inputs.

html javascript

27th Jul 2018, 7:09 AM

Daniel Cooper

5 Answers

I can't get the code playground to work for me, so I'll put the solution here. You need JS to get the value of a range input and display it. HTML: <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <input type="range" id="input"> <input type="submit" onclick="output()"> <div id="output"></div> </body> </html> JS: function output() { document.getElementById("output").innerHTML = document.getElementById("input").value }

27th Jul 2018, 8:06 AM

apex137

Is there a way to make it update live(as it moves)?

27th Jul 2018, 8:17 AM

Daniel Cooper

You'll need an eventListener. Check this guy's code: https://codepen.io/juanbrujo/pen/uIqaw

27th Jul 2018, 8:36 AM

apex137

Change to <input type="range" onchange=" document.getElementById('output').innerText = this.value"> or <input type="range" onchange="this.nextElementSibling.innerText = this.value"> https://code.sololearn.com/W1GAyFvNViDS/?ref=app

27th Jul 2018, 10:53 AM

Calviղ