1. 结合搜索条件示例
示例:
html:
js:
//搜索下拉菜单
var searchDropdown = bui.dropdown({
id: "#searchDropdown",
//设置relative为false,二级菜单继承父层宽度
relative: false,
callback: function () {
console.log( searchDropdown.value() )
}
})
2. 结合遮罩示例
示例:
html:
js:
// 下拉菜单有遮罩的情况
var uiMask = bui.mask({
autoTrigger:false,
appendTo:"#main",
zIndex:9
});
var uiDropdown = bui.dropdown({
id: "#uiDropdown"
});
// 通过监听事件绑定
uiDropdown.on("show",function () {
uiMask.show();
})
uiDropdown.on("hide",function () {
uiMask.hide();
})
3. 在结合bui-bar示例
示例:
html:
js:
//下拉菜单 在顶部右边
var barRight = bui.dropdown({
id: "#barRight",
showArrow: true,
width: 200
});
//下拉菜单 在顶部左边
var barLeft = bui.dropdown({
id: "#barLeft",
showArrow: true,
width: 200
})
//下拉菜单 在顶部中间
var barMain = bui.dropdown({
id: "#barMain",
showArrow: true,
relative: false
})