0

重複の可能性:
JavaScript ループに遅延を追加するにはどうすればよいですか?

javascript forループの各反復の完了後(または前)にどのように遅延できますか? これが私のコードですが、リストの次の色に移動する前に、色を設定したら6秒間「スリープ」する必要があります。

for (i = 0; i < switchers.length; i++) {
    $('#switchers ol li:nth-child(' + (i+1) + ')').css('color', 'green');
}

setTimeout を入れ子にしてみましたが、うまくいきませんでした。グーグルで検索した後、ここで質問することにしました。

4

2 に答える 2

2

タイムアウト間隔でループできる汎用関数を作成できます。通常「for」ループにあるコードは、最後の引数として渡す関数内に入ります。

このような:

var loopTimeout = function(i, max, interval, func) {
    if (i >= max) {
        return;
    }

    // Call the function
    func(i);

    i++;

    // "loop"
    setTimeout(function() {
        loopTimeout(i, max, interval, func);
    }, interval);
}
  • i : インクリメント変数
  • max : ループする回数
  • interval : ミリ秒単位のタイムアウト間隔
  • func : 各反復を実行する関数 (「i」が唯一の引数として渡されます)

使用例:

loopTimeout(0, switchers.length, 6000, function(i){
    $('#switchers ol li:nth-child(' + (i+1) + ')').css('color', 'green');    
});
于 2013-01-20T22:42:06.497 に答える
1

使用できます.each()

// timeout, in milliseconds to delay each iteration
var actionTimeout = 6000;

$('#switchers ol li').each(function(i, li) {
    setTimeout(function() {
        $(li).css('color', 'green');
    }, i * actionTimeout);
});

JSFiddle

于 2013-01-20T22:34:39.477 に答える