在做项目的时候,利用jQuery,提高了页面的美化,增加了效率,其中经常利用accordion制作菜单
在动态初始化菜单时,遇到一个问题如何添加一个新的panel,经过网上查找,最终找到方法:
$("#left_nav").accordion('add', {
title: "测试菜单",
content: "<p>真的添加成功了!</p>",
iconCls: "icon-ok"
});
另附accordion属性如下:
属性
Container Options
Override defaults with $.fn.accordion.defaults.
名称
|
类型
|
描述
|
默认值
|
width
|
number
|
可折叠accordion面板的宽度.
|
auto
|
height
|
number
|
可折叠accordion面板的高度.
|
auto
|
fit
|
boolean
|
如果为ture则设置可折叠accordion面板的大小以适应它的容器的父容器.
|
false
|
border
|
boolean
|
是否显示可折叠accordion面板的边框.
|
true
|
animate
|
boolean
|
定义是否显示动画效果当节点展开或折叠.
|
true
|
|
Panel 属性
The accordion panel options is inhirited from panel, many properties is defined in <div/> markup.
Below is the addition properties:
名称
|
类型
|
描述
|
默认值
|
selected
|
boolean
|
如果为true,面板将被选中.
|
false
|
|
事件
名称
|
参数
|
描述
|
onSelect
|
title
|
当用户选择一个面板时被触发.
|
onAdd
|
title
|
当增加一个可折叠accordion面板时被触发.
|
onBeforeRemove
|
title
|
当移走一个可折叠accordion面板前被触发,如果返回false取消移除.
|
onRemove
|
title
|
当移走一个可折叠accordion面板时被触发.
|
|
方法
名称
|
参数
|
描述
|
options
|
none
|
返回可折叠accordion面板对象.
|
panels
|
none
|
得到全部可折叠accordion面板.
|
resize
|
none
|
调节可折叠 accordion面板大小.
|
getSelected
|
none
|
得到选中的可折叠 accordion面板.
|
getPanel
|
title
|
得到指定的可折叠 accordion面板.
|
select
|
title
|
选择指定的可折叠 accordion面板.
|
add
|
options
|
增加一个可折叠 accordion面板.
|
remove
|
title
|
移除一个可折叠 accordion面板.
|
|