可自定义内容、标题、宽高、按钮、和绑定相对应的事件简单方便的实现弹层,实现添加数据或显示详细信息等功能。
PopupDiv(options)Contents
id
弹层的id
title
弹层的标题
width
弹层的宽度
height
弹层的高度
content
弹层的内容
ckBtnText
确认按钮文本内容
normalText
取消按钮文本内容
readyFn()
弹出层后执行的后续操作
示例:
var pd_detail = new PopupDiv({
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
readyFn: function () {
alert("弹出层后执行的后续操作");
}
});
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
readyFn: function () {
alert("弹出层后执行的后续操作");
}
});
展示效果:
okFn()
确定回调事件
示例:
var pd_detail = new PopupDiv({
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
okFn: function () {
alert("确定回调事件");
}
});
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
okFn: function () {
alert("确定回调事件");
}
});
展示效果:
closeFn()
点击否的后续操作
示例:
var pd_detail = new PopupDiv({
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
closeFn: function () {
alert("点击否的后续操作");
}
});
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
closeFn: function () {
alert("点击否的后续操作");
}
});
展示效果:
closeMainFn()
关闭弹层后的后续操作
示例:
var pd_detail = new PopupDiv({
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
closeMainFn: function () {
alert("关闭弹层后的后续操作");
}
});
title: "标题",
width: 400,
okBtnText: "确定",
normalText: "否",
content: "内容",
closeMainFn: function () {
alert("关闭弹层后的后续操作");
}
});
展示效果:
示例:
var pd_detail = new PopupDiv();
展示效果:
示例:
var pd_detail = new PopupDiv({
title: "",
okBtnText: "",
normalText: "",
content: "",
});
title: "",
okBtnText: "",
normalText: "",
content: "",
});
展示效果: