easyui 提示框组件_Jquery Easyui对话框组件Dialog使用详解（14）

Dialog对话框组件依赖于Window(窗口)组件、linkbutton 组件

加载方式

Class加载

title="弹出框"

data-options="iconCls:'icon-add',resizable:true,modal:true"

style="width: 400px;height: 200px;">

弹出框内容

JS调用加载

弹出框内容

data-options="iconCls:'icon-edit',plain:true">编辑

data-options="iconCls:'icon-help',plain:true">帮助

$(function () {

$('#box').dialog({

width : 400,

height : 200,

title : '弹出框标题',

modal : true,

// 是否显示可折叠按钮

collapsible : false,

// 是否显示最小化按钮

minimizable : false,

// 是否显示最大化按钮

maximizable : false,

// 是否可以改变对话框窗口大小

resizable : false,

// 设置对话框窗口顶部工具栏

//buttons : '#tt',

toolbar : [{

text : '编辑',

iconCls : 'icon-edit',

handler : function () {

alert('edit');

},

}, {}],

// 对话框窗口底部按钮

buttons : [{

text : '保存',

iconCls : 'icon-ok',

handler : function () {

alert('save');

}

},{}]

})

});

属性列表

窗口属性扩展自 Window(面板)，窗口新增或重新定义的属性如下

Dialog 是继承自 Window 组件的，所以 Window 组件和 Panel 组件均可用

事件列表

窗口的事件完整继承自 Window(面板)。所以，直接参考 Window 面板的事件即可。

//Dialog 事件

$('#box').dialog({

width : 600,

height : 400,

modal : true,

onClose : function () {

alert('关闭后触发！');

},

});

方法列表

对话框的方法扩展自 Window(窗口)，对话框新增方法如下

//返回外部窗口对象

//console.log($('#box').window('dialog'));

//使用$.fn.window.defaults 重写默认值对象。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。