Question

我正在尝试使用jQuery制作幻灯片，为此我尝试将所有图像的网址存储在一个文件夹中而不必手动编写它们看起来我不得不玩Ajax，但我有点困惑我基本上希望将var存储在我的PHP代码中的数组中

<?php
$dir = "img";
if (is_dir($dir)){
    if ($dh = opendir($dir)){
        $images = array();
        while (($file = readdir($dh)) !== false){
            if (!is_dir($dir.$file)) $images[] = $file;
        }
        closedir($dh);
    }
}
$max = count($images);

那么如何在javascript中快速获取$images[]的值？非常感谢帮助！：）

Answer 1

<?php
$dir = "img";
$images = array();
if (is_dir($dir)){
    if ($dh = opendir($dir)){
        while (($file = readdir($dh)) !== false){
            if (!is_dir($dir.$file)) $images[] = $file;
        }
        closedir($dh);
    }
}

header('Content-Type: application/json');
echo json_encode($images);

只要设置了头内容类型，jQuery就会自动解析JSON：

$.ajax({
 'url' : 'imagelist.php',
 'success': function(result) {
   ...
 },
});

Answer 2

<强> JS：

<script>
function loadPHP()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","somephp.php",true); //replace this with your file name
xmlhttp.send();
}
</script>

<强> HTML：

<button onclick="loadPHP()">Click to load php</button>
<div id="myDiv"></div>

<强> PHP：

<?php
$dir = "img";
if (is_dir($dir)){
    if ($dh = opendir($dir)){
        $images = array();
        while (($file = readdir($dh)) !== false){
            if (!is_dir($dir.$file)) $images[] = $file;
        }
        closedir($dh);
    }
}
$max = count($images);
$toprint = "<ul>";
foreach($images as $x => $y){
    $toprint .= ("<li>".$y."<br /></li>");
}
echo $toprint;
?>

Answer 3

我不是php的专家，但我会假设$images是一个文件名数组。如果没有，请更改您的代码以执行此操作。然后在你的php文件的末尾添加：

echo json_encode($images);

然后在javascript中，这样的事情：

$.get('imagelist.php').done(function(result) {
    $.each(result, function(idx, image) {
        console.log('found image: ' + image);
    }
});

从目录中获取图像URL

3 个答案: