bui.dropdown Class
Constructor
bui.dropdown
-
option
Parameters:
-
optionObject-
idString[控件id]
-
[handle]String optional[一级菜单的按钮]
-
[handleChildren]String optional[文本值的位置]
-
[data]Array optional[1.5新增, [{name:"",value:""}] ]
-
[target]String optional[二级菜单,默认是按钮的下一个]
-
[targetHandle]String optional[二级菜单的按钮,点击触发callback]
-
[width]Number optional[ 二级菜单的宽度,一级自适应宽度 ]
-
[showArrow]Boolean optional[ 是否显示箭头 ]
-
[showActive]Boolean optional[ 是否显示选中的高亮效果 ]
-
[relative]Boolean optional[ true相对于屏幕两边 false相对于父层 ]
-
[change]Boolean optional[ true修改文本, false只是做选择操作,可以通过change属性定义 ]
-
[autoClose]Boolean optional[ 1.4.5新增,点击二级菜单的时候自动关闭, 默认:true | false ]
-
[stopPropagation]Boolean optional[ 1.4.5新增,点击二级菜单的时候自动关闭, 默认:true | false ]
-
[position]String optional[ 显示的位置 bottom | top | left | right 也可以通过position属性设置,权限会更高 ]
-
[onBeforeInit]Function optional[ 1.5.1新增 初始化前触发 ]
-
[onInited]Function optional[ 1.5.1新增 初始化以后触发 ]
-
[callback]Function optional[ 点击按钮的回调,第一个参数是自己的引用 ]
-
Example:
html:
// 自定义模板初始化
var uiDropdown = bui.dropdown({
id: "#dropdown",
data: [{name:"分享",value:"share"}],
template: function (data) {
var html = '';
html += '<ul class="bui-list">'
data && data.forEach(function(el, index) {
html += '<li class="bui-btn" value="' + el.value + '">' + el.name + '</li>';
})
html += '</ul>'
return html;
}
})Item Index
Methods
Methods
active
-
[index]
设置某一个二级菜单的值
Parameters:
-
[index]Number optional[第几个二级菜单]
Example:
//设置值
uiDropdown.active(1);destroy
-
[bool]
[销毁控件]
Parameters:
-
[bool]Boolean optional[ 默认: false 销毁部分 | true 销毁全部 ]
Example:
//销毁
uiDropdown.destroy();disabled
()
chainable
阻止触发
Example:
uiDropdown.disabled();enabled
()
chainable
允许触发
Example:
uiDropdown.enabled();hide
()
隐藏二级菜单
Example:
//隐藏二级菜单
uiDropdown.hide();hideAll
()
隐藏所有二级菜单
Example:
//显示二级菜单
uiDropdown.hideAll();init
-
[option]
初始化方法,用于重新初始化结构,事件只初始化一次
Parameters:
-
[option]Object optional[参数控件本身]
option
-
[key] -
[value]
获取设置参数
Parameters:
-
[key]String | object optional[ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数 ]
-
[value]String | number | boolean | function optional[ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传 ]
Example:
//获取所有参数
var option = uiDropdown.option();
//获取某个参数
var id = uiDropdown.option( "id" );
//修改一个参数
uiDropdown.option( "width",200 );
//修改多个参数
uiDropdown.option( {"width":200} );reset
()
重置下拉的选择
Example:
uiDropdown.reset();show
()
显示二级菜单
Example:
//显示二级菜单
uiDropdown.show();text
-
[text]
设置或者获取文本
Parameters:
-
[text]String optional[设置文本]
Example:
//设置文本
uiDropdown.text("广东省");
//获取文本
var val = uiDropdown.text();value
-
[text]
1.5.1 支持 设置值或者文本, 或者获取值
Parameters:
-
[text]String optional[设置的值, name 或者 value 的值]
Example:
//设置值
uiDropdown.value("10");
//获取值
var val = uiDropdown.value();values
()
Object
返回一个选中的对象
Returns:
{name:"",value:""}
Example:
//设置值
var vals = uiDropdown.values();
// {name:"",value:""}widget
-
[name]
获取依赖的控件
Parameters:
-
[name]String optional[ 依赖控件名 ]
Example:
//获取依赖控件
var uiDropdownWidget = uiDropdown.widget();Events
off
为控件取消绑定事件
Event Payload:
-
[type]String optional[ 事件类型: "show" | "hide" | "change" [文本值改变的时候] ]
-
[callback]Function optional[ 绑定的事件, this 为当前点击的菜单 ]
Example:
uiDropdown.off("show");on
为控件绑定事件
Event Payload:
-
[type]String optional[ 事件类型: "show" | "hide" | "change" [文本值改变的时候] ]
-
[callback]Function optional[ 绑定的事件, this 为当前点击的菜单 ]
Example:
uiDropdown.on("show",function () {
// 点击的菜单
console.log(this);
});