Html 检索所有图像（jpg，png）而不提及图像的名称？答案

【问题标题】：Html to retrieve all images (jpg, png) without mentioning the name of the image?Html 检索所有图像（jpg，png）而不提及图像的名称？
【发布时间】：2016-08-19 17:03:29
【问题描述】：

我在网站上有以下目录

http://localhost/uploads/

我在目录中有超过 20 张图片，有多个名称。如何在不提及图像名称的情况下编写 html 以检索所有图像（jpg、png）？

<div class="img-container">
   <img src="http://localhost/uploads" ></div>

【问题讨论】：

您需要使用服务器端语言（PHP、ASP.NET 等）。
@ca8msm 你能在这里发一个简单的php代码吗

标签： javascript html css image

【解决方案1】：

这是从你的服务器获取的方法

使用：

var dir = "localhost/uploads/";
var fileextension = ".png";
$.ajax({
    //This will retrieve the contents of the folder if the folder is configured as 'browsable'
    url: dir,
    success: function (data) {
        //List all .png file names in the page
        $(data).find("a:contains(" + fileextension + ")").each(function () {
            var filename = this.href.replace(window.location, "").replace("http://", "");
            $("body").append("<img src='" + dir + filename + "'>");
        });
    }
});

如果你有其他扩展，你可以把它变成一个数组，然后使用 in_array() 一个一个地遍历。

P.s : 以上源代码未在 localhost 中测试。在托管网站中，它经过测试并且可以正常工作

【讨论】：

【解决方案2】：

试试这个你可以得到多个图片扩展

$dirname = "your-image-dir-name/";
$images =  glob("{$dirname}*.png, {$dirname}*.jpeg, {$dirname}*.gif");
foreach($images as $image) {
echo '<img src="'.$image.'" /><br />';
}

【讨论】：