easy_ui之创建树（二）

如我在左侧创建一个树形菜单：可以有如下几种方式：

1、利用<ul>和<li>创建静态的树：

在上篇文档创建的后台页面基础上添上：

< ul class = "easyui-tree" >

        < li >

            < span > Folder </ span >

            < ul >

                < li >

                    < span > Sub Folder 1 </ span >

                    < ul >

                        < li >< span > File 11 </ span ></ li >

                        < li >< span > File 12 </ span ></ li >

                        < li >< span > File 13 </ span ></ li >

                    </ ul >

                </ li >

                < li >< span > File 2 </ span ></ li >

                < li >< span > File 3 </ span ></ li >

            </ ul >

        </ li >

        < li >< span > File21 </ span ></ li >

    </ ul >

即homePage.jsp变为：

<%@ page language = "java" contentType = "text/html; charset=UTF-8"

      pageEncoding = "UTF-8" %>

<%@ include file = "/common/head.jsp" %>

< html >

< head >

< title > 我的简单的easy_ui测试 </ title >

< style type = "text/css" >

body {

      font-family : microsoft yahei ;

}

</ style >

</ head >

< body class = "easyui-layout" style =" background-color : #1D5D9C "

      data-options = "fit:true" >

      < div region = "north" style =" height : 78px ; background-color : #1D5D9C " >

      </ div >

      < div region = "west"

            style =" width : 200px ; left : 20px ; background-color : #E4EEFC "

            split = "true" >

            < ul class = "easyui-tree" >

        < li >

            < span > Folder </ span >

            < ul >

                < li >

                    < span > Sub Folder 1 </ span >

                    < ul >

                        < li >< span > File 11 </ span ></ li >

                        < li >< span > File 12 </ span ></ li >

                        < li >< span > File 13 </ span ></ li >

                    </ ul >

                </ li >

                < li >< span > File 2 </ span ></ li >

                < li >< span > File 3 </ span ></ li >

            </ ul >

        </ li >

        < li >< span > File21 </ span ></ li >

    </ ul >

           

            </ div >

      < div data-options = "region:'center'" style =" background : #87E2D1 ;" >

      </ div >

      < div region = "south" style =" height : 25px ; padding : 5px " align = "center" >

      </ div >

</ body >

</ html >