将文件夹内容中的单个img src读取到HTML中


read individual img src from folder contents into HTML

我正在尝试写一些简单的代码,但我不确定该用什么,javascript还是PHP。我有一些结构化的HTML文档,我想在每个img src属性中插入一个文件夹中的图像。所以基本上我需要阅读内容,然后一个接一个地插入每一个。

<div class="slideshow">
        <div class="wrapper">
            <ul>
                <li>
                    <div class="main">
                        <a href="product1.html"><img src="images/sample/name1-1.jpg" alt="" width="630" height="400" /></a>
                    </div>
                    <div class="second">
                        <img src="images/sample/name1-2.jpg" alt="" width="310" height="190" />
                    </div>
                    <div class="third">
                        <img src="images/sample/name1-3.jpg" alt="" width="310" height="190" />
                    </div>
                </li>

感谢任何能够引导我朝着正确方向前进的人。。

我正在使用以下代码从目录获取图像

<?php
Header("content-type: application/x-javascript");
function returnimages($dirname=".") {
$pattern="('.jpg$)|('.png$)|('.jpeg$)|('.gif$)"; 
$files = array();
$curimage=0;
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))){
if(eregi($pattern, $file)){ 
echo 'galleryarray['.$curimage.']="'.$file .'";';
$curimage++;
}
}
closedir($handle);
}
return($files);
}
echo 'var galleryarray=new Array();'; 
returnimages() 
?>

但在这一点上,我不确定如何将每个文件名插入src属性

请参阅此处,了解如何使用php将图像上传到floder:http://www.w3schools.com/php/php_file_upload.asp

然后,上传完成后,只需编写一个插入查询,即可添加到包含图像详细信息的表中,如图像名称和与其相关的产品id

INSERT INTO images (id, image_name, product_id) VALUES ('myimage.jpg', '20'); 

我假设您对"id"字段(图像的主键)使用自动递增。

然后,您只需按product_id查询图像表,获得图像名称,然后将其作为添加到scr字段中

$imagename = 'myimage.jpg';
<img src="images/<?=$imagename;?>" />

使用PHP,您可以使用glob()函数从目录中获取特定文件。

例如,glob("path/to/images/*.jpg")会在您的目录中为您提供一个jpg图像数组。然后可以使用foreach循环将它们全部打印到html页面。

您无法使用JavaScript读取服务器上的目录,因此必须使用PHP和类似RecursiveDirectoryTerator的东西(http://php.net/manual/en/class.recursivedirectoryiterator.php)