無限循環菜單列表的實現

在這裏我是用TP框架寫得,當然不用TP寫,改一下代碼就可以了,自己可以加css樣式



在控制器裏寫

public function index(){
        //初始化數據模型
        $Menu = M('Menu');
        $data = $Menu->select();
        $list = $this->menus($data,0);

        //渲染模板
        $this->assign('list',$list);
        $this->display();
    }

public function menus($data=array(),$pid=0){
        $str = '';
        foreach($data as $k=>$v){
            //$str .= $v['name'];
            if($pid == $v['pid']){
                $str .= '<li class="menu">';
                $str .= '<a href="###" class="parent">'.$v['name'].'</a>';
                $str .= '<ul>'.$this->menus($data,$v['id']).'</ul>';
                $str .= '</li>';
            }
        }
        return $str;
    }



html輸出


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="__JS__/jquery.js"></script>
    <style>
        a{text-decoration: none;color:#000000;}
        .menu ul{ display:none}
    </style>
    <script type="text/javascript">
        $(function(){
            $('.parent').click(function(){
                $(this).parent('li').children('ul').stop().slideToggle('linear');
            });
        });
    </script>
</head>
<body>
<h1>無限循環可摺疊菜單</h1>

<ul>
{$list}
</ul>

</body>
</html>



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章