David David - 6 months ago 14
HTML Question

Delayed number boxes in Chrome

I've noticed that the number input has a delay in firing the onChange event if you press the up/down arrow buttons inside the box.

On other browsers like Mac Safari and Firefox, the onChange event is called immediately.

See here: https://jsfiddle.net/yyfvv0vg/

<input type="number" max="9999" min="1" onchange="change()"/>
<div></div>

function change()
{
$("div").html($("input").val());
}


Is there a way to force it to update immediately, or is it just a fact of life that I have to deal with?

Answer

Instead of onchange event try using onmouseup it will work.

It seems like while you put the cursor over the arrows in chrome, the data is updated until you move the cursor out of the arrows, try using the up and down keywords and you will see what I'm telling you, the data is inmediatly updated.

Comments