3

配列がありs=[John; Alex; Mark]ます。この配列の要素を 1 つずつ 3 秒の遅延で表示したいと思います。

for (var i=0; i<=3; i++)
  {
     setTimeout(function(){x.innerHTML=s[i]},3000)
  }

非常に単純な問題のようですが、わかりません。

4

8 に答える 8

13
  1. あなたのループは3回ではなく4回実行されます
  2. setTimeout小文字で始まるs
  3. あなたの遅延は2000ではなく、3秒間3000でなければなりません
  4. あなたの遅延は、そうでなければ3000 * i、3000それらはすべて一度に発火します
  5. 特別な予防措置なしに、非同期コールバック内でループ変数を使用することはできません。コールバックはすべてi、ループを通過したときの値ではなく、最後に割り当てられた値を参照します。

これは機能し、ループ変数の問題を完全に回避します。

var s = ['John', 'Mark', 'Alex'];
var i = 0;

(function loop() {
    x.innerHTML = s[i];
    if (++i < s.length) {
        setTimeout(loop, 3000);  // call myself in 3 seconds time if required
    }
})();      // above function expression is called immediately to start it off

「疑似再帰」を使用して、前の反復の完了から 3000 ミリ秒後に次の反復をトリガーする方法に注意してください。これは、n未処理のタイマーをすべて同時に待機させるよりも望ましい方法です。

http://jsfiddle.net/alnitak/mHQVz/を参照してください

于 2013-04-03T13:23:14.910 に答える
0

試す

var s=['John', 'Alex', 'Mark'];
var x = document.getElementById('x');

function display(i){
    if(i >= s.length){
        i = 0;
    }

    x.innerHTML = s[i];
    setTimeout(function(){
       display(i + 1)
    }, 2000)
}

display(0)

デモ:フィドル

于 2013-04-03T13:25:52.770 に答える
0

クロージャを使用しない場合、i が未定義になることになります。これは、各反復で i をオーバーライドしているためです。完了するまでに、未定義になります。クロージャーを使用すると i が保持されます。

別の注意点として、長さを確認できる場合に、値をハードコードする (つまり、i<3) のは意味がありません。このように、 s が変更された場合でも、 for ループはすべてを取得します。

var s = ['john','mark','brian'];
for (var i = 0; i < s.length; i++) {
    (function(i) {
        setTimeout(function() {
            x.innerHTML = s[i];
        }, 3000*(i+1));
    })(i);
}
于 2013-04-03T13:27:24.870 に答える
0

一度に 2000 ミリ秒 (つまり2 秒) の4 つのタイムアウトを設定するため、コードは機能しません。3000 ミリ秒の遅延で3 つのタイムアウト (配列内の要素の数による)を設定するクロージャを使用することをお勧めします。次のコードで実行できます（小文字から書かれていることに注意してください）：setTimeout

var s = ["John", "Alex", "Mark"];
for (var i = 0; i < s.length; i++) {
    (function(i) {
        setTimeout(function() {
            x.innerHTML = s[i];
        }, 3000 * i);
    })(i);
}

デモ: http://jsfiddle.net/6Ne6z/

于 2013-04-03T13:22:47.033 に答える
0

擬似再帰なしでこれを試してください

var arr = [10,20,30,40]; // your array
var i = 0;
var interval = 2000 // 2 sec, you can add your time required
function callInterval() {
// set a variable for setInterval
	var time = setInterval(()=>{
		console.log('['+arr[i]+','+i+']');
		i++; 
		if(i==arr.length){
			this.clearInterval(time);// clear the interval after the index
		}
		}, interval);
}

callInterval();

于 2018-08-23T16:14:02.113 に答える
0

setInterval3 秒の遅延の後、要素を 1 つずつ表示するために使用できます。

s=["John", "Alex", "Mark"];

var i = 0;
var id = setInterval(function(){                
            if(i > s.length) {                  
                clearInterval(id);                  
            }
            else{
                console.log(s[i++]);
            }
}, 3000);
于 2018-02-09T20:29:41.373 に答える