（1）先要想好要操作哪个文件？
（2）确定文件的路径？
（3）要有什么文件管理功能？
一、先做一下简单的查看文件功能，文件中的文件和文件夹都显示，但是双击文件夹可以显示下一级子目录，双击“返回上一级”就可以返回到上一级目录
（1）先将需要管理的文件遍历出来，可以加个样式
<!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" />
<script src="../jquery-3.2.0.js"></script>
<title>无标题文档</title>
<style type="text/css">
*{ margin:0px auto; padding:0px;}
.mulu{ background-color:#69C; color:#FFF;}
.file{ width:50%; height:30px; border:1px solid #63F}
.prev{ background-color:#6FC; color:#63F;}
.prev:hover{ cursor:pointer;}
.mulu:hover{ cursor:pointer;}
#delete{ float:right}
</style>
</head> <body>
<input type="text" id="name" />
<input type="button" value="新建" id="new" />
<?php
session_start();//要显示的文件夹名称 $fname = "./zongbiao";//打开目录资源 if(!empty($_SESSION["url"]))
{
$fname = $_SESSION["url"];
} $dir = opendir($fname); //交给dir while($a = readdir($dir))//循环读取
{
$url = $fname."/".$a; //没有这个条件，会有./..的这个路径
if($a!="." && $a!="..")
{
if(is_dir($url)) //判断路径是不是目录
{
echo "<div class='file mulu' lj='{$url}'>{$a}</div>";//如果是目录，就进这个，起个名字，双击这个进入下一个子目录
}
else
{
echo "<div class='file' lj='{$url}'>{$a}<input type = 'button' value = '删除' lj = '{$url}' id = 'delete'/></div>"; //如果不是目录，就进入这个。。统一的起个名字，这样好给他们写样式
} } }
$fuji = dirname($fname); //文件的绝对路径
if($fname!= "./zongbiao") //判断如果不是zongbiao显示返回上一级div
{ echo "<div class='file prev' lj='{$fuji}' >返回上一级</div>";
} else
{
} closedir($dir);//关闭目录资源 ?>
</body>
<script type="text/javascript">
$(".mulu").dblclick(function(){ //找到这个目录加入双击事件
var url=$(this).attr("lj"); //点击这个目录找到这个目录的路径 $.ajax({
url:"chuli.php",
data:{url:url},//将路径传给处理页面
type:"POST",
dataType:"TEXT",
success: function(data){
window.location.href="Untitled-3.php";//刷新页面
}
})
})
$(".prev").dblclick(function(){
var url = $(this).attr("lj"); //找到这个div<br> //处理页面和遍历目录时的处理页面是一样的
$.ajax({
url:"chuli.php",
data:{url:url},
type:"POST",
dataType:"TEXT",
success: function(data){
window.location.href = "Untitled-3.php";
}
})
})
处理页面
$("#new新建文件
").click(function(){ //给新建文件加上点击事件
var name = $("#name").val() //找到新建文件的名字
$.ajax({
url:"chuli1.php",
data:{name:name},
type:"POST",
dataType:"TEXT",
success: function(d){
window.location.href = "Untitled-3.php";
}
})
})
处理页面
删除文件
$(".file").click(function(){
var lj = $(this).attr("lj");
$.ajax({
url:"chuli3.php",
data:{lj:lj},
type:"POST",
dataType:"TEXT",
success: function(a){
window.location.href = "Untitled-3.php";
}
})
})
处理页面
效果图
