easyUI之Tree（树） 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Tree（树）</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>
    <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
  </head>
  <body>
    
    
    <ul id="treeID" class="easyui-tree">   
       <li>
            <span>第一章</span>
            <ul>
                <li>
                    <span>第一节</span>
                    <ul>
                        <li>
                            <span>第一条</span>
                        </li>
                        <li>
                            <span>第二条</span>
                        </li>
                    </ul>
                </li>
                <li>
                    <span>第二节</span>
                </li>
            </ul>       
       </li>
       <li>
               <span>第二章</span>
       </li>
    </ul>  
    
    
    
    <script type="text/javascript">
        $(function(){
            //收起所有的选项
            $("#treeID").tree("collapseAll");
        });
    </script>
    
    
    
    

    
  </body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Tree（树）</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>
    <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
  </head>
  <body>
    
    <ul id="treeID"></ul>
    <script type="text/javascript">
        $("#treeID").tree({
            url : "/Demo/json/pro.json"
        });
    </script>
    
    

    <script type="text/javascript">
        
    </script>
    
    
  </body>
</html>
[
  {    
    "id":1,    
    "text":"广东",
    "state":"closed",
    "children":[
    {
       "id":11,
       "text":"广州"    ,
           "state":"closed",
           "children":[
          {
         "id":111,    
                 "text":"天河"
          },    
          {
         "id":112,    
                 "text":"越秀"
          }    
       ]
    },
    {
       "id":12,
       "text":"深圳"        
    }
    ]
  },    
  {    
    "id":2,    
    "text":"湖南"
  } 
]

 

posted on 2018-12-04 10:35  LoaderMan  阅读(451)  评论(0)  编辑  收藏  举报

导航