服务集成-九游会官网登录入口网页

一、实现效果

使用九游会官网登录入口网页-ag8九游会j9登录入口平台封装好对象o2.dl的open方法创建弹出层，传入options参数构建弹出框内容、按钮等元素

实现效果：

对象源代码位置：o2server/o2web/source/o2_core/o2/xdesktop/dialog.js,

该对象继承至o2.widget.dialog，源代码位置：o2server/o2web/source/o2_core/o2/widget/dialog.js

实现代码如下：

var dialog = o2.dl.open({
  "style" : "o2",
  "title": "弹出框标题",
  "width": "400",
  "height" : "200",
  "ismax": false,
  "isclose": true,
  "isresize": true,
  "ismove": true,
  "istitle": true,
  "offset": {"x":-200, "y": -100},
  "mask": true,
  "content": new element("div"),
  "container": this.form.getapp().content,
  "duration": 200,
  "buttonlist": [
    {
      "text": "确定",
      "action": function(){
          var result = {"key":"value"};
          if (callback) callback.apply(this, [result]);  
          dialog.close();
      }.bind(this)
    },
    {
      "text": "取消",
      "action": function(){
       		dialog.close();
      }.bind(this)
    }
  ],
  "onqueryclose": function(){
    	console.log("-onqueryclose-");
  }.bind(this),
  "onpostclose": function(){
    	console.log("-onpostclose-");
  }.bind(this),
  "onqueryload":function(){
  	  console.log("-onqueryload-");
  },
  "onpostload": function(){
   	 console.log("-onpostload-");
   	 new element("div",{text:"这是内容区域"}).inject(this.content);
     // ...code...
  },
  "onqueryshow": function(){
 	   console.log("-onqueryshow-");
  },
  "onpostshow": function(){ 
  	  console.log("-onpostshow-");
  }.bind(this)
})

二、主要参数说明

1)、style：弹出框使用的样式，默认是default，系统内置一些样式，比如：flat,o2,chartd等，对应样式文件位置路劲：o2servero2websourceo2_coreo2widget$dialog，用户也可以自己增加自定义样式风格，对应文件及结构参考已有样式风格。

2)、title：弹出框头部标题，在istitle参数为true时有效。

3)、width：弹出框宽度。 默认值：300

4)、height：弹出框高度。 默认值：150

5)、ismax：标题栏是否有最大化按钮，相对应有还原按钮，默认值：false

6)、isclose：标题栏是否有关闭按钮。默认值：false

7)、isresize：弹出框大小是否可调整。默认值：true

8)、ismove：弹出框是否可移动。默认值：true

9)、istitle：是否显示标题栏。默认值：true

10)、offset：弹出框相对默认x轴y轴位置

11)、mask：是否需要遮罩层。默认值：true

12)、content：弹出框层的容器。

13)、container：弹出框层dom对象需要插入页面html内元素的位置，默认插入到body中。

14)、duration：动画显示弹出框效果时间。默认值：200

15)、buttonlist：定义底部按钮，比如“确认”，“关闭”按钮等，数组列表。text：按钮显示名称，action：                按钮对应的点击事件

16)、onqueryclose：关闭弹出框前事件

17)、onpostclose：关闭弹出框后事件

18)、onqueryload：弹出框载入前事件

19)、onpostload：弹出框载入后事件

20)、onqueryshow：弹出框显示前事件

21)、onpostshow：弹出框显示后事件

三、其他注意事项及说明

1)、调用弹出框对象后各事件执行先手顺序 onqueryload-->onpostload-->onqueryshow-->onpostshow

2)、弹出框传值问题，通过apply方法，在关闭弹出框后把值通过回调方法传到外部调用的对象中。

3)、除了以上列出的一些常用参数及方法外，可以查看widgetdialog.js源代码文件中其他内置的参数及方法。               比如setcontentsize(),设置居中，recenter()重新设置居中位置等方法。

4)、可以自定义一个dialog类设置继承widget.dialog重写内置方法，满足特殊的业务