1

でこのappend()関数を使用するのに問題がありsetTimeoutます。SetTimeoutを削除すると、すべての画像が読み込まれます。ここに入れると、変数がスコープ外または無効になっているようです。私がここで間違っていることについて何か提案はありますか？

//    thumbs[] is an array with image sources.

for (var imageIndex = 0; imageIndex < thumbs.length; imageIndex++) {

     var im = thumbs[imageIndex];

     setTimeout(function(im){  
         $("#a").append("<img class='images' src='" + im + "' />");
     },1000);

} // end for
4

2 に答える 2

6

imコールバックに渡そうとしないでくださいsetTimeout。im関数は親スコープにアクセスできるため、無名関数はを読み取ることができます。そのように渡そうとするとうまくいきません。setTimeout引数を渡さずに、コールバックを内部的に呼び出します。im実際に行っているのは、無名関数内に新しい未定義のローカル変数を作成し、外部スコープからの変数へのアクセスをブロックすることです。したがって、これは機能するはずです。

 var im = thumbs[imageIndex];
 setTimeout(function(){  
     $("#a").append("<img class='images' src='" + im + "' />");
 },1000);

ただし、コードはループ内にあり、ループ内でそれを行うだけでは十分ではありません。setTimeout呼び出しは非同期であるため、実行されると、常にimループ（）の最後の値になります。thumbs.lengthクロージャーを作成することで、これを回避できます。スシルの答えはその一例なので、別のスタイルを紹介します。

for (var imageIndex = 0; imageIndex < thumbs.length; imageIndex++) {
     var im = thumbs[imageIndex];
     setTimeout(createTimerCallback(im), 1000);

} 

function createTimerCallback(im) {
    return function(){  
         $("#a").append("<img class='images' src='" + im + "' />");
    };
}
于 2012-11-14T18:36:19.980 に答える
5

これを試して。あなたの場合、im中setTimeoutはundefiendです。 

for (var imageIndex = 0; imageIndex < thumbs.length; imageIndex++) {

     var im = thumbs[imageIndex];

     setTimeout(function(im){  
         $("#a").append("<img class='image' src='" + im + "' />");
     },1000, im);

}

setTimeout IEは、すべてのブラウザで機能させたい場合は、パラメータの受け渡しをサポートしていません。

   for (var imageIndex = 0; imageIndex < thumbs.length; imageIndex++) {

         var im = thumbs[imageIndex];
       (function(im){
         setTimeout(function(){  
             $("#a").append("<img class='image' src='" + im + "' />");
         },1000);
 })(im);

    }
于 2012-11-14T18:36:12.047 に答える