いくつかの時間の後またはいくつかのアクションの後にsetIntervalを停止する方法はありますか？

Question

私はこの答えのコードを使用してjQueryの と「変える言葉」のループを作成しました： jQuery: Find word and change every few seconds

私はいくつかの時間後にそれをどのように停止するのですか？ 60秒後か、それともループを過ぎた後に言いましたか？

あなたはここで変更する言葉見ることができます： 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); 

     })(); 

Answer 1

設定した回数だけ実行した後に停止するには、間隔にカウンタを追加してから、その数に達したときにクリアします。

あなたが行うことができます

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

あなたが設定した時間（例えば1分）が経過した後に、それを停止する場合：

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

Answer 2

は間隔をクリアするclearIntervalを使用してください。 setIntervalメソッドから取得したインターバルIDを渡す必要があります。

など。あなたは以下のようにコードを変更することができます

clearInterval(intervalId); 

を使用する上記の間隔をクリアする

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

。

(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); 

})(); 

Answer 3

あなたは競合状態を避けるために、代わりにsetInterval()の再帰setTimeout()を使用することを検討すべきです。

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); 
      } 
     }); 
    }); 
}()); 

Answer 4

あなたは優れている、代わりにsetTimeoutを使用することができます。

(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); 
 
    })(); 
 
})();