Thank you for taking the time for reading my question.
A "range" input element in HTML (Slider) fires an onchange -event, in which the content of a span element gets updated with the current value of the input element.
Somehow, the first change made to the input element doesn't fire the onchange event. When an 'onclick' event is used, it does fire.
Here's the code, HTML first:
<div>
<input id="main_options_plug1_lengthPE_input" type="range" step="10" value="0" max="200" min="0" onchange="setOpenEndPELength('plug1');"></input>
<span id="main_options_plug1_lengthPE_value"> … </span>
</div>
And now JavaScript:
function setOpenEndPELength(plug)
{
if (plug == "plug1" || plug == "plug2")
{
var slider = document.getElementById("main_options_" + plug + "_lengthPE_input");
var span = document.getElementById("main_options_" + plug + "_lengthPE_value");
span.innerHTML = slider.value + " mm";
}
}
I created a JSFiddle, so you can try it yourself.
I didn't find an answer to this question on stackoverflow so far, any questions i found were about onchange event don't firing at all. In this case, it's only the first change that doesn't work.
Hope someone knows the answer. Any help is greatly appreciated, thanks in advance.