インジケーターをロードするための setTimeout または setInterval ループを停止するにはどうすればよいですか?

setTimeout ループの停止

スプライトを使用して読み込みインジケーターを作成する場合、背景の位置を循環するループに依存するのが一般的です。 1 つのアプローチには setTimeout 関数の使用が含まれますが、読み込みプロセスの完了時にループを停止する必要がある場合はどうすればよいでしょうか?

setTimeout の実装

JavaScript の setTimeout 関数は、 clearTimeout 関数を使用してタイムアウトをキャンセルできるようにするタイマー ハンドル。これを実装するには、setBgPosition 関数内に stop() 関数を作成します。

function setBgPosition() {
    var c = 0,
        timer = 0;
    ...
    return stop;

    function stop() {
        if (timer) {
            clearTimeout(timer);
            timer = 0;
        }
    }
}

これを使用するには、setBgPosition 関数を変数に割り当て、後で stop() 関数を呼び出して、ループ:

var stop = setBgPosition();
// ... later ...
stop();

代替アプローチ: setInterval

setTimeout を使用する代わりに、指定された間隔で関数を繰り返し実行する setInterval を使用できます。これを clearInterval で使用する方法は次のとおりです:

function setBgPosition() {
    ...
    return setInterval(run, 200);
}

ループを停止するには:

var timer = setBgPosition();
// ... later ...
clearInterval(timer);

ただし、完了条件を検出し、setBgPosition でループを停止できるようにするためのオプションを検討することをお勧めします。ループそのもの。このアプローチにより、読み込み操作の処理における制御性と柔軟性が向上します。

以上がインジケーターをロードするための setTimeout または setInterval ループを停止するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。