web-dev-qa-db-fra.com

comment arrêter un setInterval après un certain temps ou après un certain nombre d'actions?

J'ai créé une boucle de "changement de mots" avec jQuery en utilisant le code de cette réponse: jQuery: Trouver Word et changer toutes les quelques secondes

Comment puis-je l'arrêter après un certain temps? dire après 60 secondes ou après avoir parcouru la boucle?

Vous pouvez voir les mots changer ici: http://skolresurser.se/

(function(){

            // List your words here:
            var words = [
                'Lärare',
                'Rektor',
                'Studievägledare',
                'Lärare',
                'Skolsyster',
                'Lärare',
                'Skolpsykolog',
                'Administratör'
                ], i = 0;

            setInterval(function(){
                $('#dennaText').fadeOut(function(){
                    $(this).html(words[i=(i+1)%words.length]).fadeIn();
                });
               // 2 seconds
            }, 2000);

        })();
javascriptjqueryloops
36
Alisso

Pour l'arrêter après avoir exécuté un nombre défini de fois, ajoutez simplement un compteur à l'intervalle, puis quand il a atteint ce nombre, effacez-le.

par exemple.

var timesRun = 0;
var interval = setInterval(function(){
    timesRun += 1;
    if(timesRun === 60){
        clearInterval(interval);
    }
    //do whatever here..
}, 2000);

Si vous voulez l'arrêter après un temps défini (par exemple 1 minute), vous pouvez faire:

var startTime = new Date().getTime();
var interval = setInterval(function(){
    if(new Date().getTime() - startTime > 60000){
        clearInterval(interval);
        return;
    }
    //do whatever here..
}, 2000);
100
Mark Rhodes

Utilisez clearInterval pour effacer l'intervalle. Vous devez passer l'ID d'intervalle que vous obtenez à partir de la méthode setInterval.

Par exemple.

var intervalId = setInterval(function(){
                    ....
                 }, 1000);

Pour effacer l'intervalle ci-dessus, utilisez

clearInterval(intervalId);

Vous pouvez changer votre code comme ci-dessous.

(function(){

    // List your words here:
    var words = [
        'Lärare',
        'Rektor',
        'Studievägledare',
        'Lärare',
        'Skolsyster',
        'Lärare',
        'Skolpsykolog',
        'Administratör'
        ], i = 0;

    var intervalId = setInterval(function(){
        $('#dennaText').fadeOut(function(){
            $(this).html(words[i=(i+1)%words.length]).fadeIn();
            if(i == words.length){//All the words are displayed clear interval
                 clearInterval(intervalId);
            }
        });
       // 2 seconds
    }, 2000);

})();
4
ShankarSangoli

Vous pouvez utiliser setTimeout à la place, ce qui est mieux:

(function foo(){ // wrap everything in a self-invoking function, not to expose "times"
  times = 20; // how many times to run
  (function run(){
    // do your stuff, like print the iteration
    document.body.innerHTML = times;

    if( --times ) // 200 * 20 = 4 seconds
      setTimeout(run, 100);
  })();
})();
2
vsync

Vous devriez envisager d'utiliser une setTimeout() récursive au lieu de setInterval() pour éviter une condition de concurrence critique.

var fadecount = 1;
(function interval(){  
    $('#dennaText').fadeOut(function(){
        $(this).html(words[i=(i+1)%words.length]).fadeIn('fast',function(){
            if (fadecount < 30){
                fadecount += 1;
                setTimeout(interval, 2000);
            }
        });
    });
}());
2
AlienWebguy