如何定义javascript以显示在php脚本中找到的图像

如何定义javascript以显示在php脚本中找到的图像,javascript,php,html,directory,slideshow,Javascript,Php,Html,Directory,Slideshow,首先,我是新来的,我感谢这里所有我了解的人 我的问题是: 我创建了一个设置,您可以通过两种不同的方式将图片上传到文件夹“test”中。 我想在自动幻灯片中显示图片,将图片从文件夹中取出。(Imag 1.jpg、2.jpg、3.jpg在文件夹测试中。) 我的PHP代码: <?php $dir_path = "test/"; $extensions_array = array('jpg','png','jpeg'); $phpArray = array(); $dateien=scandir

首先,我是新来的,我感谢这里所有我了解的人

我的问题是: 我创建了一个设置,您可以通过两种不同的方式将图片上传到文件夹“test”中。 我想在自动幻灯片中显示图片,将图片从文件夹中取出。(Imag 1.jpg、2.jpg、3.jpg在文件夹测试中。)

我的PHP代码:

<?php
$dir_path = "test/";
$extensions_array = array('jpg','png','jpeg');
$phpArray = array();

$dateien=scandir($dir_path);
$anzahl=count($dateien);

    //echo "Anzahl $anzahl";


if(is_dir($dir_path))
{
$files = scandir($dir_path);

for($i = 0; $i < count($files); $i++)
{
if($files[$i] !='.' && $files[$i] !='..')
    {
        $file = pathinfo($files[$i]);
        $extension = $file['extension'];

        while(in_array($extension, $extensions_array))
        {
        // show image

        echo "<img src='$dir_path$files[$i]' style='width:500px;height:500px;'><br>";
           $phpArray []= array($dir_path, $files[$i]); 
           $filename[]= array($files[$i]);
            //echo $i;
            $i++;
        //echo "Anzahl $anzahl";

                if ($i>$anzahl) 
                    {break;}
            }
    }
}
}
$dir_path2 = "uplaods/";
$dateien2=scandir($dir_path);
$anzahl2=count($dateien2);

if ($anzahl2>$anzahl)

?>

使用php代码,我可以获得文件夹路径和文件名,并且可以单独显示图片,但不能以幻灯片形式显示:

我的HTML/JAVASCRIPT代码

<!DOCTYPE html>
<html>
<title>automatic slideshow</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
.mySlides {display:none;}
</style>
<body>

<h2 class="w3-center">Automatic Slideshow</h2>

<div class="w3-content w3-section" style="max-width:500px">
<img class="mySlides" src="1.jpg" style="width:100%" >
<img class="mySlides" src="2.jpg" style="width:100%">
<img class="mySlides" src="3.jpg"style="width:100%">
</div>


<script>

var myIndex = 0;
carousel();

function carousel() {
var i;
 var x = document.getElementsByClassName("mySlides");  / HERE I NEED HELP
for (i = 0; i < x.length; i++) {
   x[i].style.display = "none";  
}
myIndex++;
if (myIndex > x.length) {myIndex = 1}    
x[myIndex-1].style.display = "block";  
setTimeout(carousel, 2000); // Change image every 2 seconds
}

</script>

</body>
</html>

自动幻灯片放映
.mySlides{display:none;}
自动幻灯片放映
var-myIndex=0;
转盘();
函数旋转木马(){
var i;
var x=document.getElementsByClassName(“mySlides”);/这里我需要帮助
对于(i=0;ix.length){myIndex=1}
x[myIndex-1].style.display=“block”;
setTimeout(carousel,2000);//每2秒更改一次图像
}
幻灯片代码适用于我在div中定义的图像,但我想将其从文件夹中取出。我能够从php到javascript获取文件名和文件夹路径,但我无法告诉javascript显示文件夹外的图片


有可能吗

有几种方法可以做到这一点,但是JavaScript无法迭代文件系统目录中的文件(除非您使用的是服务器端JavaScript)。一种选择是让PHP脚本将图像的URI(相对或绝对)输出到JavaScript数组。另一种选择是让PHP脚本在HTML头中输出JavaScript,利用URI创建图像对象(这有利于预加载图像),并将对象放置在JavaScript数组中。一个更复杂的解决方案是,PHP脚本返回一个图像URI的JSON数组,您可以通过AJAX GET请求从JavaScript中检索该数组。

PHP:

<?php
$dir_path = "test/";
//$dir_path2 = "uplaods/";
$extensions_array = array('jpg','png','jpeg');

if(is_dir($dir_path))
{
    $files = array_slice(scandir($dir_path), 2);
    foreach ($files as $file)
    {
        $ext = pathinfo($file);
        $ext = $ext['extension'];

        if(in_array($ext, $extensions_array))
            $images[] = '<img class="mySlides" src="'. $dir_path . $file .'" style="width:500px;height:500px;">';
    }
}
?>

HTML(在PHP文件中):


自动幻灯片放映
.mySlides{display:none;}
自动幻灯片放映
var-myIndex=0;
转盘();
函数旋转木马(){
var i;
var x=document.getElementsByClassName(“mySlides”);//我需要帮助
对于(i=0;ix.length){myIndex=1}
x[myIndex-1].style.display=“block”;
setTimeout(carousel,2000);//每2秒更改一次图像
}

你把php放在w3中心之间了吗?很可能有多种方式,通过java脚本或在一个文件中。首先是php部分,而不是包含html的部分javascript@Flostens每次重新加载页面时,它都会添加所有扩展名为“jpg”、“png”、“jpeg”的图像文件。