EasyUI框架中有一些常用的控件，如面板、表格、表单、下拉框、下拉树和手风琴等。手风琴控件可以选择不同的菜单类型，每个切换标签页显示不同的内容，根据不同的参数选择不同的界面。下面利用一个具体的实例来说明，操作如下：
工具/原料
1
EasyUI框架
2
jQuery
3
HBuilder
4
浏览器
5
截图工具
6
HTML5
7
CSS3
方法/步骤
1
第一步，双击打开HBuilder编辑工具，在创建的web项目指定目录下，创建静态页面accordion.html，如下图所示：
2
第二步，引入EasyUI核心JS和CSS文件，并引入jQuery核心js，注意文件先后顺序，如下图所示：
3
第三步，在body内插入Accordion控件，并使用季度作为标题，调用手风琴样式，如下图所示：
4
第四步，在Accordion的每个子菜单里添加每个季度的月份，利用无序列表展示，如下图所示：
5
第五步，在手风琴控件下方添加一个按钮，并设置按钮ID和title，以作为不同内容显示，如下图所示：
注意事项
1
注意EasyUI框架中Accordion的用法
2
注意Accordion控件调用的方法
上一篇：手风琴风箱技巧运用