//创建窗体
var box=$pagebox.create({
width: 400,
height: 300,
right:10,
top:10,
url: 'pagebox-child.html',
title: '可移动，可缩放；双击标题栏全屏'
});
box.open();
属性：
大部分属性支持双向绑定，可以直接设置属性改变窗体。
下表中，“可监听”的属性，可以通过watch()增加监听方法，类似Vue；“双向绑定”的意思是属性更改后，直接影响窗体样式。
| 属性 | 说明 | 可监听 | 双向绑定 |
|---|---|---|---|
| title | 窗体的标题栏文字 | √ | √ |
| url | 窗体中的内容页网址 | √ | √ |
| width,height | 宽高 | √ | √ |
| top,left | 窗体上和左的位置 | √ | √ |
| right,bottom | 窗体右和下的位置 | √ | √ |
| ico | 窗体左上角图标 | √ | |
| full | 设置窗体最大化 | √ | √ |
| mini | 设置窗体最小化，注意它与min的区别 | √ | √ |
| resize | 是否允许缩放窗体 | √ | √ |
| move | 是否允许移动窗体 | √ | √ |
| max | 是否允许窗体最大化 | √ | √ |
| min | 是否允许窗体最小化 | √ | √ |
| close | 是否显示关闭按钮 | √ | √ |
| dom | 窗体的dom对象 | ||
| parent | 父窗体对象 | ||
| childs | 下级窗体对象列表 |
下表只列出了常用方法，更多请参看源码。
| 方法 | 说明 | 参数 |
|---|---|---|
| open() | 打开窗体，触发onshown事件 | 无 |
| watch() | 增加自定义属性监听 | //obj:pagebox对象，val：传入的值，old:原值 例如：box.watch({ 'title':function(obj,val,old){ console.log('通过外部监听，新的title：'+val); } }); |
| focus() | 当前窗体获取焦点，最前面显示 | |
| shut() | 关闭当前窗体 | |
| toFull() | 窗体最大化，建议直接box.full=true;将自动触发这个方法； | |
| toWindow() | 窗体还原，建议直接box.full=false或box.mini=false | |
| document() | iframe中的文档对象 | |
| getChilds() | 所有子级窗体，包括下级的下级 | |
| bind() | 绑定事件 | bind(事件名,方法) 事件名仅限 'shown', 'shut', 'load', 'fail', 'click', 'drag', 'focus', 'blur', 'min', 'full', 'restore', 'resize' |
| trigger() | 触发事件 | trigger(事件名,[消息]) |
事件支持多播，即同一个事件可以添加多个方法。事件方法的返回型仅限bool型，虽然可以返回其它类型或不返回，但最终都会转为bool型返回值。
当同一个事件中的多个方法，有任一个返回false，则不再继续执行后续事件方法。如果不返回，默认是true。
var box=$pagebox.create();
//关闭事件
box.onshut(function(s,e){
return confirm('是否确定关闭？');
}).onshut(function(s,e){
return confirm('再次确认关闭？');
});
box.open();
| 事件 | 说明 | 参数sender | 参数e |
|---|---|---|---|
| shown | 打开 | 当前pagebox对象 | e.event：事件名称 e.action：动作，默认与e.event同值 e.target：响应事件的html元素，此处为窗体的html |
| shut | 关闭 | 同上 | 同上 |
| load | 加载完成，不管是否失败 | e.target：窗体iframe中的文档对象（document) e.url：窗体iframe中的页面路径，即src的值 |
|
| fail | 加载失败 | 同上 | |
| click | 点击 | 与onshown相同 | |
| drag | 拖动位置 | e.target：窗体标题栏 e.mouse:鼠标当前坐标,{x,y} e.move：移动的偏移量（相较于拖动之前）,{x,y} e.offset:当前窗体的位置,{left,top} |
|
| focus | 获取焦点 | 与onshown相同 | |
| blur | 失去焦点 | 与onshown相同 | |
| mini | 最小化 | 与onshown相同 | |
| full | 最大化 | 与onshown相同 | |
| restore | 还原 | e.action:如果是全屏还原，为from-full; 最小化还原为from-min | |
| resize | 缩放窗体大小 | e.mouse:鼠标当前坐标,{x,y} e.move：移动的偏移量（相较于拖动之前）,{x,y} e.offset:当前窗体的位置,{left,top} e.width:缩放宽度 e.height:缩放高度 e.target:缩放控件 e.action:缩放的方向 |