Home jQuery .change() function heavily delayed with number-input
Reply: 1

jQuery .change() function heavily delayed with number-input

RadicalM1nd
1#
RadicalM1nd Published in 2017-12-07 22:04:28Z

I have an issue with the .change() function in JQuery in combination with an input of the type "number".
Quick and dirty mockup that gets the point across:
JSfiddle: https://jsfiddle.net/vtuk69bj/

$('#testInput').change(function(){
$('#testDiv').html($('#testInput').val());
})

As you can see if you use the arrows inside the input to increase/decrease numbers quickly (or even not so quickly), the function is incredibly delayed in some cases.

I know I could use stuff like keyup or click, but that wouldn't cover both the option to increase/decrease with arrows or straight up input a number yourself. Is there some way to cover all my bases without having 2-3+ different functions?

Taplar
2#
Taplar Reply to 2017-12-07 22:08:13Z

The input event fires any time the value of the input changes.

$('#testInput').on('input', function() {
  $('#testDiv').html(this.value);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="testInput" type="number" min="1" max="999">
<div id="testDiv">
  1
</div>

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.325391 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO