显示所有文件 · php

这里面用到dir.png,file.png这个图片,这图片去阿里巴巴矢量库中找个文件的小图标就好了 ~~~ <!doctype html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <title>展示出所有文件</title> <style> *{padding: 0; margin: 0; font-size: 18px; font-family: 楷体;} .con{ margin: 20px 0 0 20px; } b{ display: inline-block; width: 40px; } .dir i{ display: inline-block; width: 19px; height: 19px; background: url('./dir.png') no-repeat; background-size: 19px; position: relative; top: 4px; cursor: pointer; } .file i{ display: inline-block; width: 19px; height: 19px; background: url('./file.png') no-repeat; background-size: 19px; position: relative; top: 4px; } .box{display: none;} </style> <script src='jquery.js'></script> <script> $(function(){ $('.dir i').click(function(){ $(this).parent('.dir').next('.box').toggle(); }); }); </script> </head> <body> <div class="con"> <?php function showAll($dir, $b=''){ // 打开句柄 $handle = opendir($dir); // 过滤.和.. readdir($handle); readdir($handle); while(($fileName = readdir($handle))||($fileName!==false)){ if($fileName == '.htaccess') continue; // 拼接完整路径 $newFile = "$dir/$fileName"; // 转码 $fileName = iconv('gbk', 'utf-8', $fileName); if(is_dir($newFile)){ echo "<div class='dir'>$b<i></i>$fileName</div>"; echo "<div class='box'>"; showAll($newFile, $b.'<b></b>'); echo '</div>'; }else{ // 编码，将中文转为%跟两位十六进制的数据类型 $newFile = urlencode($newFile); echo "<div class='file'>$b<i></i><a href='./doDownload.php?f=$newFile'>$fileName</a></div>"; } } // 关闭 closedir($handle); } showAll('./files'); ?> </div> </body> </html> ~~~