javascript - PHP Javascript 图像渲染

Question

我在两个不同的 div 中有两种形式，我试图在其中一个中呈现文件夹中的图像:

第一个表单呈现一个ul li，它的id 和name 是matchListUL。

 echo '<li id="matchList" name="matchList"><a href="'.implode('; ', $data).'">'.implode('; ', $data).'</a></li>';

通过 javascript，我将所选 li 的值传递给名为 loadimages.php 的 php 文件。以下是javascript。

<script>
  $(document).ready(function(){
  $('ul#matchListUL li a').click(function(){
      var match = $(this).attr('href');
      if (match !== null && match !=="") {
      $.post("loadimages.php", { match : match }, function(output){
      $("#imageload").html(output).show();
      });
          return false;
           })
      })
</script>

第二个 div 有 id 和 name 作为 imageload。 loadimages.php 如下:

$match = $_POST['match'];
$selectedDir = $_SESSION['seldir'];
$tarDir = "kennels/" . $selectedDir . "/" . $match;

$my_image_array = scandir($tarDir);                    
$img_string = "";
foreach($my_image_array as $img_name){
    if(strlen($img_name) > 2 ) {
        $imgname = $tarDir . $img_name;    
        $img_string .= '<img src = "' .$imgname. '">';
    }
}
echo $img_string;

当我从 loadimages.php 运行代码时，图像没有得到渲染。我是否必须更改我的 javascript 中的这一行以适应图像渲染？

$("#imageload").html(output).show();

当我从我的主 index.php 运行(只需少量修改)相同的代码时，它会呈现图像。

我尝试了 loadimages.php 中的代码的替代方法，我在其中硬编码了图像文件夹的路径:

$files = glob("kennels/projects/images/*.jpg");
for ($i=1; $i<count($files); $i++)
{
    $num = $files[$i];
    echo '<img src="'.$num.'" id="thumbNails"/>';

}

这在我的 index.php 中也能完美运行，但不会渲染 loadimages.php 中的任何图像。

Answer 1

如果您注意到 $match 变量后没有 .'/'

 $match = $_POST['match'];
$selectedDir = $_SESSION['seldir'];
$tarDir= "kennels/" . $selectedDir . "/" . $match;

所以当你通过循环运行它时

$my_image_array = scandir($tarDir);                    
 $img_string = "";
 foreach($my_image_array as $img_name){
if(strlen($img_name) > 2 ) {
    $imgname = $tarDir . $img_name;    
    $img_string .= '<img src = "' .$imgname. '">';
   }
}
echo $img_string;

它会回显类似这样的内容 "kennels/imagesImagefile.ext"而不是“犬舍/图像/Imagefile.ext”

因此，要解决此问题，您可以在 $match 变量之后或 $tarDir 和 $img_name 之间添加斜杠/，如下所示

 $imgname = $tarDir.'/'. $img_name;    

同样在您的 jQuery 发布请求中为你的第一场比赛添加一个引号

$.post("loadimages.php", { 'match' : match }, 
function(output)