如何使用jQuery/Javascript将一个文件夹中的所有图像加载到我的网页中

Question

如何使用jQuery/Javascript将一个文件夹中的所有图像加载到我的网页中

我在我的.js文件所在的目录中有一个名为“映像”的文件夹。我希望使用jQuery/Javascript将“图像”文件夹中的所有图像加载到我的html页面中。

由于图像的名称不是连续整数，我该如何加载这些图像？

Answer 1

这里有一种方法。还需要做一些PHP。PHP部分：$filenameArray&nbsp;=&nbsp;[];$handle&nbsp;=&nbsp;opendir(dirname(realpath(__FILE__)).'/images/'); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while($file&nbsp;=&nbsp;readdir($handle)){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if($file&nbsp;!==&nbsp;'.'&nbsp;&&&nbsp;$file&nbsp;!==&nbsp;'..'){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;array_push($filenameArray,&nbsp;"images/$file"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}echo&nbsp;json_encode($filenameArray);jQuery部分：$.ajax({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url:&nbsp;"getImages.php", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;dataType:&nbsp;"json", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;success:&nbsp;function&nbsp;(data)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(data,&nbsp;function(i,filename)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$('#imageDiv').prepend('<img&nbsp;src="'+&nbsp;filename&nbsp;+'"><br>'); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});基本上，您需要执行一个PHP文件，将图像文件名列表返回为JSON，然后使用Ajax调用获取该JSON，并将它们添加到html中。您可能希望过滤从文件夹抓取的文件。在php部件上有一些帮助1