标签：
在本教程中，你将学习到有关于easyui折叠面板的知识。折叠面板包含了一系列的面板，其中所有的面板标题都是可见的，但只有一个面板的主体内容在某个时间是可见的。当用户点击面板标题时，该面板的主体内容可见，其他面板的内容将会被隐藏。
我们将创建三个面板，其中第三个面板包含了一个树形菜单。
<
div
class
=
"easyui-accordion"
style
=
"width:300px;height:200px;"
>
<
div
title
=
"About Accordion"
iconcls
=
"icon-ok"
style
=
"overflow:auto;padding:10px;"
>
<
h3
style
=
"color:#0099FF;"
>Accordion for jQuery</
h3
>
<
p
>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</
p
>
</
div
>
<
div
title
=
"About easyui"
iconcls
=
"icon-reload"
selected
=
"true"
style
=
"padding:10px;"
>
easyui help you build your web page easily
</
div
>
<
div
title
=
"Tree Menu"
>
<
ul
id
=
"tt1"
class
=
"easyui-tree"
>
<
li
>
<
span
>Folder1</
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
>File2</
span
></
li
>
</
ul
>
</
div
>
</
div
>
下载该EasyUI示例：easyui-accordion-demo.zip
有兴趣的朋友可以点击查看更多有关jQuery EasyUI的文章！
标签：
原文地址：http://my.oschina.net/u/2317468/blog/529757
