开始使用 文档 演示/教程 独立组件 社区
全部分类 实体操作 脚本控件

JavaScript弹层控件

  可自定义内容、标题、宽高、按钮、和绑定相对应的事件简单方便的实现弹层,实现添加数据或显示详细信息等功能。

PopupDiv(options)
id

弹层的id

title

弹层的标题

width

弹层的宽度

height

弹层的高度

content

弹层的内容

ckBtnText

确认按钮文本内容

normalText

取消按钮文本内容

readyFn()

弹出层后执行的后续操作

示例:

var pd_detail = new PopupDiv({
   title: "标题",
   width: 400,
   okBtnText: "确定",
   normalText: "否",
   content: "内容",
   readyFn: function () {
      alert("弹出层后执行的后续操作");
   }
});

展示效果:

okFn()

确定回调事件

示例:

var pd_detail = new PopupDiv({
   title: "标题",
   width: 400,
   okBtnText: "确定",
   normalText: "否",
   content: "内容",
   okFn: function () {
      alert("确定回调事件");
   }
});

展示效果:

closeFn()

点击否的后续操作

示例:

var pd_detail = new PopupDiv({
   title: "标题",
   width: 400,
   okBtnText: "确定",
   normalText: "否",
   content: "内容",
   closeFn: function () {
      alert("点击否的后续操作");
   }
});

展示效果:

closeMainFn()

关闭弹层后的后续操作

示例:

var pd_detail = new PopupDiv({
   title: "标题",
   width: 400,
   okBtnText: "确定",
   normalText: "否",
   content: "内容",
   closeMainFn: function () {
      alert("关闭弹层后的后续操作");
   }
});

展示效果:

示例:

var pd_detail = new PopupDiv();

展示效果:

示例:

var pd_detail = new PopupDiv({
   title: "",
   okBtnText: "",
   normalText: "",
   content: "",
});

展示效果:

开始使用| 文档| 演示/教程| 独立组件| 社区 快递查询 Copyright © 2016 - 2017 tiaoceng.com All Rights Reserved