从文件夹加载图像列表

我有一个图像文件夹，从10到200，一个网页，一个jquery淡入淡出和一个PHP脚本，读取文件夹充满图像

有没有办法让php脚本扫描文件夹，获取图像列表（在数组中？）并将其传递给jquery脚本？ （第一个问题）

现在，我可以从找到的文件的结果php列表中创建一个xml文件，或者从html的列表中创建一个html

。 有没有其他方法可以做到这一点？ （问题2）

Answer 1

从nickf的优秀答案继续，这对于不同类型的图像来说稍微强一些。

 $imagesDir = 'path/to/your/images/'; $images = glob($imagesDir . '*.{jpg,jpeg,png,gif}', GLOB_BRACE); echo json_encode($images); 

还有其他方法可以做到这一点，但这是最简单的方法。 请注意，某些文件系统区分大小写，因此请确保扩展列表与您正在使用的内容完全匹配。

Answer 2

glob函数将扫描文件夹并返回一个数组：

 $jpgs = glob("*.jpg"); 

然后，您可以使用JSON将其传递回jQuery：

 echo json_encode($jpgs); 

然后它只是循环结果，生成必要的HTML。

Answer 3

要生成列表项，您可以使用类似的东西（假设图像是json_encode（）的结果）：

 var images = {'image1':'images/image1.jpg','image2':'images/image2.jpg'} jQuery('#imagelist').empty(); jQuery.each(images, function() { jQuery('#imagelist').append('
https://stackoverflow.com/questions/758594/load-list-of-image-from-folder/'+this+'
'); }); 

并确保HTML源中有一个无序/有序列表：

 
 
No images found
  

Answer 4

您不能只将图像作为“数据”传递到JavaScript中进行显示，至少不能以合理的方式进行显示。

Answer 5

我将在这里尝试一下许多人的回答

亚历克斯和尼克：

并从mattoc（修改）来使用超大型

 jQuery('#imagelist').empty(); jQuery.each(images, function() { jQuery('#imagelist').append(''); }); 

并希望最终得到类似的东西！

对于最后一段代码，我将不得不找到一个解决方案来发送图像以“逐个”超大插件与预加载没有问题与图像的错误列表

假设我得到150个图像列表……这将是一个问题，所以让插件只知道有2个图像，预加载下一个和“ajax”更改下一个图像

 image001.jpg is display ... preload image002.jpg display image002.jpg ... preload image003.jpg on and on and on.... 

这一切都是动态地直到arrays结束！