どのようにjQueryの

Question

を使用して自分のWebページに一つのフォルダからすべての画像をロードするために、私はここでjqueryの

を使用して動的に一つのフォルダから画像をロードしようとしていますが、私のコードは

$(document).ready(function(){ 
var dir = "img/"; 
var fileextension = ".jpg"; 
var i = "1"; 
var n; 
$(function imageloop(){ 
$("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 
for(i=1;i<n;i++){ 
imageloop(); 
}; 
     }); 
}); 

しかし、画像があるだけですここに何か間違いがありますか？

次のコードが機能していますが、私は、forループの代わりに、もし他の

$(document).ready(function(){ 
var dir = "img/"; 
var fileextension = ".jpg"; 
var i = "1"; 
$(function imageloop(){ 
$("<img />").attr('src', dir + i + fileextension).appendTo("#images").width(150).height(150); 
if (i==6){ 
alert('loaded'); 
} 
else{ 
i++; 
imageloop(); 
}; 
     }); 
}); 

Answer 1

Initialize n. 

あなたの現在の機能

var dir = "img/"; 
    var fileextension = ".jpg"; 
    var i = 1; 
    var n; 
     $(function imageloop(){ 
      $("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 
      for(i=1;i<n;i++){ 
       imageloop(); 
      }; 
     }); 

時間スタックリミットがオーバーになるまで、それは1.jpgを追加しますitself.soそれは常に呼び出しているので、iの値が変更されることはありません。

にコードを変更してください。

 var dir = "img/"; 
 
     var fileextension = ".jpg"; 
 
    $(document).ready(function(){ 
 
     var i = 1; 
 
     var n = 3; 
 
    
 
     for(i=1;i<n;i++){ 
 
      imageloop(i); 
 
     }; 
 
    }); 
 
    
 
    function imageloop(i){ 
 
     $("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 
 
     }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id = "images"> </div>

はimages.youがnの所望の値を有することができ、2を追加します。

Answer 2

と仮定すると、VARのn = 3

の変化から

$(document).ready(function(){ 
    var dir = "img/"; 
    var fileextension = ".jpg"; 
    var i = "1"; 
    var n; 
    $(function imageloop(){ 
     $("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 
    for(i=1;i<n;i++){ 
     imageloop(); 
    }; 
    }); 
}); 

へ

$(document).ready(function(){ 
      var dir = "img/"; 
      var fileextension = ".jpg"; 
      var i = "1"; 
      var n = 3; 
      for(i=1;i<n;i++){ 
       imageloop(i); 
      } 
}); 
function imageloop(i){ 
       $("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 

} 

たい

Answer 3

コードでは、nは初期化されていません。だからあなたのループは動作しません。それを初期化すれば正常に動作します。

また、ループ内の値を再初期化するときに、iを"1"として初期化する必要はありません。ここ

$(document).ready(function(){ 
    var dir = "img/"; 
    var fileextension = ".jpg"; 
    var n = 10; // 10 is an example value 

    var imageloop = function(){ 
     $("<img />").attr('src', dir + i + fileextension).appendTo("#images"); 
    }; 

    for(var i=1;i<n;i++){ 
     imageloop(); 
    }; 
});