Question

I am trying to consecutively add +1 to the value of a text input field when the user clicks a button.

Simplified, my JQuery code is something like this:

$('#button').on({
 mousedown : function () {
 var value = $(this).val();
 $(this).val(value + 1);
 },
 mouseup : function () {
 //Some other stuff here
 }
});

This works every time the user clicks the button.
What I want is if the user keeps the button pressed, the mousedown event to fire every 0.2s until he stops pressing (and than the mouseup event fires).

I figure this should somehow be done with setTimeout() but I would be glad if someone showed me how. Thanks.

Answer 1

Use setInterval and clearInterval:

var interval;
$('#button').on({
  mousedown : function () {
    var el = $(this);
    el.val(parseInt(el.val(), 10) + 1);
    interval = window.setInterval(function(){
      el.val(parseInt(el.val(), 10) + 1);
    }, 200);
  },
  mouseup : function () {
    window.clearInterval(interval);
  }
});

However, it’s not possible to run as often as every 0.2 ms, I suppose that you mean every 0.2 seconds…