<body> <?php //定义文件目录 $fname = "./ce"; //便利目录下的所有文件显示 $arr = glob($fname."/*"); foreach ($arr as $v) { //从完整路径中取文件名 $name = basename($v); echo "<div url='{$v}'>{$name}</div>"; } ?> </body>
图：
接下来给文件夹特殊显示一下把：
输出之前需要判断，判断是不是一个文件夹：
//从完整路径中取文件名 $name = basename($v); if(is_dir($v)){ echo "<div url='{$v}'>{$name}</div>"; } else { echo "<div url='{$v}'>{$name}</div>"; }
如果是个文件夹，给他背景颜色改变一下就好啦
图：
2.给文件夹添加双击事件：
双击实现进入这个目录；
js代码：
<script> $(".dir").dblclick(function(){ var url = $(this).attr("url"); $.ajax({ url:"chuli.php", data:{url:url}, type:"POST", dataType:"TEXT", success:function(data) { window.location.href="wenwen.php" ; } }); }) </script>
处理页面：
<?php
session_start();
$url = $_POST["url"];
$_SESSION["fname"] = $url;
这样就可以实现双击进入此文件夹：
3.返回上一级，找到上一级目录，写个div
$pname = dirname($fname); echo "<div url='{$pname}'>返回上一级</div>";
图：
写双击事件：
<script> $("#shang").dblclick(function(){ var url = $(this).attr("url"); $.ajax({ url:"chuli.php", data:{url:url}, type:"POST", dataType:"TEXT", success:function(data) { window.location.href="wenwen.php" ; } }); }) </script>
返回到文件目录后使其隐藏：
//上一级的目录 $pname = dirname($fname); if(realpath($fname)=="F:\\QQPCMgr\\WWW\\wenjian") {} else { echo "<div url='{$pname}'>返回上一级</div>"; }
这样的话当我返回到wenjian目录的时候，使其隐藏：
4.删除功能
在文件div里面加删除按钮：
echo "<div url='{$v}'>{$name}
<input type='button' value='删除' url='{$v}'/>
</div>";
来写按钮的点击事件：
js代码：
$(".sc").click(function(){ //确认删除提示 var av = confirm("确定要删除"); if(av){ var url = $(this).attr("url"); $.ajax({ url: "shan.php", data: {url: url}, type: "POST", dataType: "TEXT", success: function (data) { window.location.href = "wenwen.php"; } }); } })
删除的处理页面：
<?php $url = $_POST["url"]; unlink($url);
这样完成后，当我点击删除：
再点击确定，即可删除
总代码：
管理查看页面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script src="https://www.jb51.net/jquery-1.11.2.min.js"></script> <style> .item{ width: 500px; height: 30px; border: 1px solid slateblue; background-color: aquamarine; line-height: 30px; } .dir{ background-color: chocolate; color: aliceblue; } #shang{ width: 500px; height: 30px; border: 1px solid slateblue; background-color: brown;color: aliceblue; line-height: 30px; } </style> </head> <body> <?php session_start(); //定义文件目录 $fname = "./ce"; if(!empty($_SESSION["fname"])) { //如果session里面的不为空 $fname = $_SESSION["fname"]; } //上一级的目录 $pname = dirname($fname); if(realpath($fname)=="F:\\QQPCMgr\\WWW\\wenjian") {} else { echo "<div url='{$pname}'>返回上一级</div>"; } //便利目录下的所有文件显示 $arr = glob($fname."/*"); foreach ($arr as $v) { //从完整路径中取文件名 $name = basename($v); if(is_dir($v)){ echo "<div url='{$v}'>{$name}</div>"; } else { echo "<div url='{$v}'>{$name} <input type='button' value='删除' url='{$v}'/> </div>"; } } ?> <script> $(".dir").dblclick(function(){ var url = $(this).attr("url"); $.ajax({ url:"chuli.php", data:{url:url}, type:"POST", dataType:"TEXT", success:function(data) { window.location.href="wenwen.php" ; } }); }) $("#shang").dblclick(function(){ var url = $(this).attr("url"); $.ajax({ url:"chuli.php", data:{url:url}, type:"POST", dataType:"TEXT", success:function(data) { window.location.href="wenwen.php" ; } }); }) $(".sc").click(function(){ //确认删除提示 var av = confirm("确定要删除"); if(av){ var url = $(this).attr("url"); $.ajax({ url: "shan.php", data: {url: url}, type: "POST", dataType: "TEXT", success: function (data) { window.location.href = "wenwen.php"; } }); } }) </script> </body> </html>
处理：
<?php session_start(); $url = $_POST["url"]; $_SESSION["fname"] = $url;
删除：
<?php $url = $_POST["url"]; unlink($url);