acción de repetición de JavaScript cuando se mantiene presionado el mouse

Question

¿Hay una función de JavaScript repetida cada tantos milisegundos que un botón html se mantiene pulsado? Sería genial si esto se pudiera hacer con JavaScript estándar, pero usar jQuery o un plugin jQuery también sería genial.

Answer 1

En el evento mousedown(), este código inicia un temporizador repetitivo (cada 500ms en este ejemplo) que se cancela tan pronto como ocurre el evento mouseup(). Esto debe ser adaptable a lo que quiere:

var intervalId; 
$("#button").mousedown(function() { 
    intervalId = setInterval(do_something, 500); 
}).mouseup(function() { 
    clearInterval(intervalId); 
}); 

function do_something() { 
    // whatever 
} 

Ver setInterval() para obtener más información sobre cómo eliminar los temporizadores.

Answer 2

Utilizaría la función javascript setInterval() dentro de una función que se ejecuta con el mouse hacia abajo.

<input type="button" id="button" onmousedown="inter=setInterval(startAction, 1*1000);" 
onmouseup="clearInterval(inter);" value="click here" /> 

<script type="text/javascript"> 
    function startAction(){ 
     //whatever you want done 
    } 
</script> 

Answer 3

Veo un problema con las dos soluciones enumeradas anteriormente.

onmouseup solo se activa si el mouse se suelta mientras está sobre el botón. Si el usuario mantiene el mouse hacia abajo y luego retira el mouse antes de soltarlo, entonces clearInterval nunca se dispara, por lo que do_something disparará para siempre.

Debería agregar otro evento, "onmouseout", que también llame a clearInterval.

Answer 4

var intervalId; 
$("#button").mousedown(function() { 
    intervalId = setInterval(do_something, 500); 
}).mouseup(function() { 
    clearInterval(intervalId); 
}).mouseleave(function() { 
//this should help solve the problem that occurs when the mouse leaves the button while pressed down 
    clearInterval(intervalId); 
}); 

function do_something() { 
    // whatever 
}