11月17日下午文件管理(页面上显示文件和文件夹,文件夹可以打开也可以返回上一层文件夹)

<!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="../../jquery-1.11.2.min.js"></script>
<style type="text/css">
*{ margin:0px auto; padding:0px}
#wai{ width:800px;}
.list{ width:100%; height:35px; background-color:#09F; margin-top:2px; color:white; font-weight:bold; text-align:left; line-height:35px; vertical-align:middle; font-size:28px; padding:5px}
.mulu{ background-color:#FC9}
.mulu:hover{ cursor:pointer}
</style>
</head>
<body>

<br />
<div id="wai">
<?php
    session_start();
    
    $filename="";//定义$filename为空字符串
    
    if(!empty($_SESSION["lujing"]))//判断session存储如果不为空
    {
        $filename = $_SESSION["lujing"];//把session存储的路径赋值给$filename
        
        $sj = dirname($_SESSION["lujing"]);//找上级目录
        echo "<div id='prev' class='list' lj='{$sj}'>返回上一层</div>";
    }
    else//如果session存储为空
    {
        $filename = "./bootstrap";//就让$filename的值为当前文件夹中的bootstrap文件夹
    }
    
    
    ?>
    <div id="nr">
 <?php        
        //打开该文件夹
        $dir = opendir($filename);//打开$filename存储的文件夹
        while($f = readdir($dir))//把$filename里面的所有内容遍历出来
        {
            if($f!="." && $f!="..")//去掉.和..
            {
                $ml = $filename."/".$f;//把$filename里面的文件拼接成目录
                if(is_file($filename."/".$f))//判断如果是文件
                {
                    echo "<div class='list'>{$f}</div>";//直接输出文件名
                }
                else//如果是文件夹
                {
                    echo "<div lj='{$ml}' class='list mulu'>{$f}</div>";//给文件夹多添加一个class
                }
            }
        }
        
        closedir($dir);
        
        ?>
    </div>
</div>

<script type="text/javascript">

$(".mulu").dblclick(function(){//添加双击事件
        
        var lj = $(this).attr("lj");//取点击内容自己的属性值lj,lj里面存储的是点击的文件夹的目录,例如点击的bootstrap,lj存储的就是./bootstrap
        $.ajax({//调用ajax
                url:"chuli.php",
                data:{lj:lj},
                type:"POST",
                dataType:"TEXT",
                success: function(){
                    window.location.href="text.php";
                    }
            });
    
    })

$("#prev").dblclick(function(){
        var lj = $(this).attr("lj");
        $.ajax({
                url:"chuli.php",
                data:{lj:lj},
                type:"POST",
                dataType:"TEXT",
                success: function(){
                    window.location.href="text.php";
                    }
            });
    
    })
</script>

</body>
</html>

chuli.php页面

<?php
session_start();
$lj = $_POST["lj"];
$_SESSION["lujing"] = $lj;

 

posted @ 2016-11-18 13:27  飘逸De精灵  阅读(227)  评论(0编辑  收藏  举报