Question

在浏览器窗口中创建全屏幻灯片

在javascriptkit上找到了这两个优秀的代码

http://www.javascriptkit.com/javatutors/externalphp2.shtml

php生成图像文件数组，javascript / css / html运行show。

我编辑了css / html，以便图像填满窗口。这部分不是问题。

我希望php在每次运行时生成一个随机列表。好像是shuffle（$ files）;是答案（？），但无论我把它放在php文件中，它都无法正常工作。

<? 
//PHP SCRIPT: getimages.php

Header("content-type: application/x-javascript");

//This function gets the file names of all images in the current directory
//and ouputs them as a JavaScript array
function returnimages($dirname=".") {
  $pattern="(\.jpg$)|(\.png$)|(\.jpeg$)|(\.gif$)"; //valid image extensions
  $files = array();
  $curimage=0;
  if($handle = opendir($dirname)) {
    while(false !== ($file = readdir($handle))){
      if(eregi($pattern, $file)){ //if this file is a valid image
        //Output it as a JavaScript array element
        echo 'galleryarray['.$curimage.']="'.$file .'";';
        $curimage++;
      }
    }

    closedir($handle);
  }
  return($files);
}

echo 'var galleryarray=new Array();'; //Define array in JavaScript
returnimages() //Output the array elements containing the image file names
?>

有人可以帮我洗一下生成的文件列表数组吗？

谢谢

HTML：

<script src="pics/getimages.php"></script>

<script type="text/javascript">

var curimg=0
function rotateimages(){
document.getElementById("slideshow").setAttribute("src", "pics/"+galleryarray[curimg])
curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
}

window.onload=function(){
setInterval("rotateimages()", 5000)
}
</script>

<div>
<img id="slideshow" src="pics/animal_0001.jpg" />
</div>

原始php文件的输出：

var galleryarray=new Array();
galleryarray[0]="nature_0001.jpg";
galleryarray[1]="animal_0107.jpg";
galleryarray[2]="nature_0007.jpg";
galleryarray[3]="nature_0083.jpg";
galleryarray[4]="animal_0120.jpg";
galleryarray[5]="nature_0025.jpg";
galleryarray[6]="summertime.jpg";
galleryarray[7]="nature_0091.jpg";
galleryarray[8]="travel_0018.jpg";
galleryarray[9]="animal_0052.jpg";
galleryarray[10]="travel_0038.jpg";
galleryarray[11]="animal_0047.jpg";
galleryarray[12]="nature_0016.jpg";
galleryarray[13]="nature_0024.jpg";
galleryarray[14]="travel_0053.jpg";

修订版的输出：

var galleryarray = true;

处理：

http://www.tsah.co.uk/tsah/slide/slides.html

Answer 1

通过自己构建JS，你已经过度复杂了。试试json_encode：

<?php

function returnimages($dirname=".") {
  $images = array(); 
  $pattern="(\.jpg$)|(\.png$)|(\.jpeg$)|(\.gif$)"; //valid image extensions
  if($handle = opendir($dirname)) {
    while(false !== ($file = readdir($handle))){
      if(eregi($pattern, $file)){ //if this file is a valid image
        $images[] = $file;
      }
    }

    closedir($handle);
  }
  return $images;
}

$images = returnimages();
shuffle($images);

Header("content-type: application/x-javascript");
echo 'var galleryarray = ' . json_encode( $images ) . ';'; 
?>

shuffle不会返回混洗数组，而是返回操作的状态（TRUE / FALSE）。

从现有代码PHP随机化文件列表数组？

1 个答案: