$('div.e2e-opt').on('click', 'button', function() {
var action = $(this).attr('data-action');
switch (action) {
//不重新定义按钮,按规范默认显示 确认 和 取消 两个按钮,在callback中传入,点完成按钮时执行的回调函数
case "open-window":
BH_UTILS.bhWindow('内容','标题', null, null,function($dom){
$("mark").text("按钮的回调函数");
});
break;
//重新定义按钮,确定按钮阻止弹窗关闭
case "custom-window":
BH_UTILS.bhWindow("内容1", "标题",
[
{
text:'保存',className:'bh-btn-warning',
callback:function(){
$("mark").text("点击了确认按钮");
return false; //可以阻止弹窗关闭
}
},
{
text:'关闭',
className:'bh-btn-default',
callback:function(){
//需要定义一个空函数,以关闭弹窗
}
}
],
{
height: 300,
width: 500
}
);
break;
//动态内容弹窗
case "dynamic-window":
//动态创建弹窗内容
var dailog = $("<div><input id='content'></div>").append("动态内容");
BH_UTILS.bhWindow(dailog, "标题",
[
{
text:'确认',className:'bh-btn-warning',
callback:function(){
$("mark").text($("#content").val());
}
},
{
text:'取消',className:'bh-btn-default',
callback:function(){
$("mark").text("点击了取消按钮");
}
}
],
{
close:function(){
//确认和取消的时候,都会进入这里
dailog.remove();//需要手动销毁
$("mark").append(" 销毁动态弹窗");
}
}
);
break;
default:
break;
}
});
<div class="e2e-opt">
<button data-action="open-window">默认打开</button>
<button data-action="custom-window">重新定义按钮,确定按钮阻止弹窗关闭</button>
<button data-action="dynamic-window">动态内容弹窗</button>
</div>
<mark>
返回状态
</mark>