2019獨角獸企業重金招聘Python工程師標準>>>

<jQuery EasyUI最新版下載>

在本教程中，你將學習到有關于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的文章！

轉載于:https://my.oschina.net/u/2317468/blog/529757

總結

以上是生活随笔為你收集整理的jQuery EasyUI使用教程之创建可折叠面板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。