1. ホーム
  2. javascript

JavaScriptでループタイマー

2023-08-10 07:13:26

質問

私は2000ミリ秒ごとにJavaScriptのコードの一部を実行する必要があります。

setTimeout('moveItem()',2000)

上記は2000ミリ秒後に関数を実行し、それ以降は実行しません。

というわけで、moveItem関数の内部には

function moveItem() {
    jQuery(".stripTransmitter ul li a").trigger('click');
    setInterval('moverItem()',2000);
}

2000ミリ秒ごとにトリガークリックのjQueryコードを実行したいのですが、今はずっと呼び出されていて、スクリプトを中断する必要があるため、これはうまくいきません。それに加えて、これは非常に質の悪いコーディングだと感じています...。皆さんはどのようにこれを解決しますか?

どのように解決するのですか?

以下のことに注意してください。 setTimeoutsetInterval は全く異なる機能です。

  • setTimeout はコードを実行します 一度だけ を実行し、タイムアウトの後に
  • setInterval はコードを実行します。 永遠に を、指定されたタイムアウトの間隔で実行します。

どちらの関数も タイマーID を返し、それを使ってタイムアウトを中止することができます。この値を変数に格納し、それを引数として clearTimeout(tid) または clearInterval(tid) をそれぞれ使用します。

つまり、何をしたいかに応じて、2つの有効な選択肢があるのです。

// set timeout
var tid = setTimeout(mycode, 2000);
function mycode() {
  // do some stuff...
  tid = setTimeout(mycode, 2000); // repeat myself
}
function abortTimer() { // to be called when you want to stop the timer
  clearTimeout(tid);
}

または

// set interval
var tid = setInterval(mycode, 2000);
function mycode() {
  // do some stuff...
  // no need to recall the function (it's an interval, it'll loop forever)
}
function abortTimer() { // to be called when you want to stop the timer
  clearInterval(tid);
}

どちらもごく一般的な実現方法です。