Arrêtez l'appel setInterval en JavaScript

Question

Je utilise setInterval(fname, 10000); pour appeler une fonction toutes les 10 secondes en JavaScript. Est-il possible de cesser cet appel sur un certain événement?

Je veux que l'utilisateur soit capable d'arrêter le rafraîchissement répété de données.

Answer 1

La méthode clearInterval() peut être utilisée pour effacer un minuteur défini avec la méthode setInterval().

setInterval retourne toujours une valeur ID. Cette valeur peut être passée dans clearInterval() pour arrêter le minuteur. Voici un exemple de minuteur démarrant à 30 et s'arrêtant quand il atteint 0.

let time = 30;
const timeValue = setInterval((intervalle) => {
  time = this.time - 1;
  if (time <= 0) {
    clearInterval(timeValue);
  }
}, 1000);

Answer 2

@cnu,

Vous pouvez arrêter l'intervalle, quand vous essayez d'exécuter le code avant de regarder votre console de navigateur (F12) ... essayez de commenter clearInterval (trigger) puis regardez à nouveau la console, pas de relooking? :P

Vérifiez l'exemple d'une source:

var trigger = setInterval(function() { 
  if (document.getElementById('sandroalvares') != null) {
    document.write('SandroAlvares');
    clearInterval(trigger);
    console.log('réussite');
  } else {
    console.log('Déclencheur!!');
  }
}, 1000);

Auteur

Answer 3

C'est ainsi que j'ai utilisé la méthode clearInterval() pour arrêter le chronomètre après 10 secondes.

function startCountDown() {
  var countdownNumberEl = document.getElementById('countdown-number');
  var countdown = 10;
  const interval = setInterval(() => {
    countdown = --countdown <= 0 ? 10 : countdown;
    countdownNumberEl.textContent = countdown;
    if (countdown == 1) {
      clearInterval(interval);
    }
  }, 1000)
}

    Afficher le temps

Answer 4

En nodeJS, vous pouvez utiliser le mot-clé spécial "this" dans la fonction setInterval.

Vous pouvez utiliser ce mot-clé "this" pour clearInterval, voici un exemple:

setInterval(
    function clear() {
            clearInterval(this) 
       return clear;
    }()
, 1000)

Lorsque vous imprimez la valeur de ce mot-clé spécial "this" dans la fonction, vous obtenez un objet Timeout Timeout {...}

Answer 5

Déclarez une variable pour assigner la valeur retournée de setInterval(...) et passez la variable assignée à clearInterval();

par exemple

var timer, intervalInSec = 2;

timer = setInterval(func, intervalInSec*1000, 30 ); // le troisième paramètre est l'argument de la fonction appelée 'func'

function func(param){
   console.log(param);
}

// Partout où vous avez accès à timer déclaré ci-dessus, appelez clearInterval

$('.htmlelement').click( function(){  // tout événement que vous voulez

       clearInterval(timer);// Arrête ou fait le travail
});