¿Cómo borro este setInterval dentro de una función?
⏰ 2 minutos de lectura
Óscar ahijado
Normalmente, establecería el intervalo en una variable y luego lo borraría como var the_int = setInterval(); clearInterval(the_int); pero para que mi código funcione lo puse en una función anónima:
Él setInterval El método devuelve un identificador que puede usar para borrar el intervalo. Si desea que la función lo devuelva, simplemente devuelva el resultado de la llamada al método:
function intervalTrigger() {
return window.setInterval( function() {
if (timedCount >= markers.length) {
timedCount = 0;
}
google.maps.event.trigger(markers[timedCount], "click");
timedCount++;
}, 5000 );
};
var id = intervalTrigger();
Luego para borrar el intervalo:
window.clearInterval(id);
nota: no necesita hacer referencia al alcance global. setInterval funciona tan bien como window.setInterval.
– Samie Bencherif
6 de julio de 2017 a las 3:37
A menudo es una buena práctica ser explícito. Algunos linters se quejarán del uso implícito del alcance global, mientras que window. está bien
–Steve Bennett
29 de octubre de 2020 a las 4:41
// Initiate set interval and assign it to intervalListener
var intervalListener = self.setInterval(function () {someProcess()}, 1000);
function someProcess() {
console.log('someProcess() has been called');
// If some condition is true clear the interval
if (stopIntervalIsTrue) {
window.clearInterval(intervalListener);
}
}
the_int=window.clearInterval(the_int);
La forma más simple que se me ocurrió: agregar una clase.
Simplemente agregue una clase (en cualquier elemento) y verifique dentro del intervalo si está allí. Esto es más confiable, personalizable y multilingüe que cualquier otra forma, creo.
var i = 0;
this.setInterval(function() {
if(!$('#counter').hasClass('pauseInterval')) { //only run if it hasn't got this class 'pauseInterval'
console.log('Counting...');
$('#counter').html(i++); //just for explaining and showing
} else {
console.log('Stopped counting');
}
}, 500);
/* In this example, I'm adding a class on mouseover and remove it again on mouseleave. You can of course do pretty much whatever you like */
$('#counter').hover(function() { //mouse enter
$(this).addClass('pauseInterval');
},function() { //mouse leave
$(this).removeClass('pauseInterval');
}
);
/* Other example */
$('#pauseInterval').click(function() {
$('#counter').toggleClass('pauseInterval');
});
<!-- you'll need jQuery for this. If you really want a vanilla version, ask -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="counter"> </p>
<button id="pauseInterval">Pause/unpause</button></p>
¿Ha sido útil esta solución?
Tu feedback nos ayuda a saber si la solución es correcta y está funcionando. De esta manera podemos revisar y corregir el contenido.
Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos.
Configurar y más información