小兔网

jQuery EasyUI 扩展 jQuery EasyUI 扩展2021071307084918805221

用法

步骤 1:创建一个 HTML 页面

    <div id="pp" style="width:800px;height:500px;">        <div style="width:33%"></div>        <div style="width:33%"></div>        <div style="width:33%"></div>    </div>

步骤 2:创建 Portal

    $('#pp').portal(options);

步骤 3:向 Portal 添加面板(panel)部件

    // create the panel    var p = $('<div></div>').appendTo('body');    p.panel({        title: 'My Title',        height:150,        closable: true,        collapsible: true    });         // add the panel to portal    $('#pp').portal('add', {        panel: p,        columnIndex: 0    });

属性

名称类型描述默认值
widthnumberportal 的宽度。auto
heightnumberportal 的高度。auto
borderboolean定义是否显示 portal 的边框。false
fitboolean当设置为 true 时,设置 portal 的尺寸以适应它的父容器。false

事件

名称参数描述
onStateChangenone当用户拖放面板(panel)时触发。
onResizewidth,height当 portal 的尺寸改变时触发。

方法

名称参数描述
optionsnone返回选项(options)对象。
resizeparam设置 portal 的尺寸,'param' 参数包括下列属性:
width:portal 的新宽度。
height:portal 的新高度。
getPanelscolumnIndex获取指定的列面板(panel),当 columnIndex 参数为分配时,则返回所有的面板(panel)。
addparam添加一个新的面板(panel),'param' 参数包括下列属性:
panel:要添加的面板(panel)对象。
columnIndex:要插入的列索引。
removepanel移除并销毁指定的面板(panel)。
disableDraggingpanel禁用面板(panel)的拖拽功能。
enableDraggingpanel启用面板(panel)的拖拽功能。

下载 jQuery EasyUI 实例

jquery-easyui-portal.zip

jQuery EasyUI 扩展 jQuery EasyUI 扩展