web-dev-qa-db-ja.com

JQueryで5秒ごとに関数を呼び出す最も簡単な方法は何ですか?

JQuery、5秒ごとに関数を呼び出す方法.

スライドショーで画像の変更を自動化する方法を探しています。

可能であれば、他のサードパーティ製プラグインをインストールしないでください。

479
ensnare

あなたはこれのためにjqueryを必要としません、プレーンなJavaScriptで、以下はうまくいくでしょう!

window.setInterval(function(){
  /// call your function here
}, 5000);

ループを止めるには

clearInterval() 
857
Doug Neiner

setIntervalを使ってページに間隔を登録できます。

setInterval(function(){ 
    //code goes here that will be run every 5 seconds.    
}, 5000);
96
John Boker

最初の回答のためのちょっとしたコツ。あなたの関数がすでに定義されているなら、その関数を参照してください、しかし、それを呼び出さないでください!そのため、関数名の後に括弧を付けないでください。と同じように:

my_function(){};
setInterval(my_function,10000);

SetInterval()を購読し、永久ループを止めるためにclearInterval()を使用する場合の良い例です。

function myTimer() {
    console.log(' each 1 second...');
}

var myVar = setInterval(myTimer, 1000);

この行を呼び出してループを停止します。

 clearInterval(myVar);
30

上記の関数は、前回の呼び出しで完了したかどうかに関係なく実行されます。実行が完了すると、x秒ごとに実行されます。

// IIFE
(function runForever(){
  // Do something here
  setTimeout(runForever, 5000)
})()

// Regular function with arguments
function someFunction(file, directory){
  // Do something here
  setTimeout(someFunction, 5000, file, directory)
  // YES, setTimeout passes any extra args to
  // function being called
}
30
Steel Brain

setIntervalsetTimeoutの両方があなたのために働くことができます(@Doug Neinerと@John Bokerが書いたように 両方とも今はsetIntervalを指しています。
どちらがあなたに最も適しているのか、そしてどのようにしてそれらを止めるのかを知るための両方についての詳細な説明は here を参照してください。

9
Dror

window.setIntervalを使用することができ、時間はミリ秒単位で定義する必要があります。以下の場合、関数は1秒ごとに呼び出されます(1000ミリ秒)。

<script>
  var time = 3670;
window.setInterval(function(){

  // Time calculations for days, hours, minutes and seconds
    var h = Math.floor(time / 3600);
    var m = Math.floor(time % 3600 / 60);
    var s = Math.floor(time % 3600 % 60);

  // Display the result in the element with id="demo"
  document.getElementById("demo").innerHTML =  h + "h "
  + m + "m " + s + "s ";

  // If the count down is finished, write some text 
  if (time < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }

  time--;
}, 1000);


</script>
3
erdeepak