How to execute a function when the user hold a button and stop executing when the user releases the button. As in WhatsApp when you are going to record an audio ...
How to execute a function when the user hold a button and stop executing when the user releases the button. As in WhatsApp when you are going to record an audio ...
You can do this:
var intervalId = 0;
// Define o evento de clicar com o botão do mouse no #click
$('#click').on('mousedown', function() {
intervalId = setInterval(hold, 500); // Define um intervalo que a função será chamanda em 0.5 segundos
});
// Define o evento de soltar ao documento
$(document).on('mouseup', release);
// Função que será chamada com delay de 0.5 segundos
function hold() {
console.log('Pressionando...');
}
// Função que será chamada quando soltar o botão
function release() {
if(intervalId != 0) {
clearInterval(intervalId); // Limpa o intervalo registrado anteriormente
intervalId = 0;
console.log('Soltou!');
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonid="click">Clique e segure</button>
I believe the necessary actions are the following, it is necessary to implement the code of your recording, see if it helps you:
$(function() {
$("button").mouseup(function() {
$("#gravando").text('Não');
// Sua lógica para parar a gravação
}).mouseout(function() {
$("#gravando").text('Não');
// Sua lógica para parar a gravação
}).mousedown(function() {
$("#gravando").text('Sim');
// Sua lógica para iniciar a gravação
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><p>EstáGravando?</p><divid="gravando">Não</div>
<button>Gravar</button>
I believe that it meets your request.
I got Bruno Rigolon's help, I just switched the 'mousedown' and 'mouseup' events to touchstart and touchend because I'm using the phonegap.
The code looks like this:
$('#btn_gravar').on('touchstart',function(){
//Inicia o processo de gravação
});
$('#btn_gravar').on('touchend',function(){
//Para o processo de gravação
});