Question

I have a form button with an onclick event that runs a simple javascript function (adds 1 to a value).

I have to click the mouse button each time for this to run, is there any way of making it so if the mouse button is held down it runs it too, but every half a sec?

CURRENT CODE

<script>
  function incrementValue(id) {
    var value = parseInt(document.getElementById(id).innerHTML);
    value=++; 
    document.getElementById(id).innerHTML = value;
    }
</script>

html

<input type="text" id="attk">
<input type="text" id="def">

<input type="button" onclick="incrementValue('attk')">
<input type="button" onclick="incrementValue('def')">

Answer 1

The following will repeat every 500ms while the button is pressed – and will increment a counter

JavaScript:

var intervalId; // keep the ret val from setTimeout()
function mousedownfunc(divid) {
    intervalId = setInterval(runme, 500, divid);
}

function mouseupfunc() {
    clearInterval(intervalId);
}

function runme(divid) {
    document.getElementById(divid).innerHTML = parseFloat(document.getElementById(divid).innerHTML) + 1;
}

HTML :

<input type="button" onmousedown="mousedownfunc('counter')" value="clickme" onmouseup="mouseupfunc('counter')" /><br/>
<div id="counter">1</div>

Working example with counter -> http://jsfiddle.net/73uKk/1/