创建模态对话框

使用教程 » 创建模态对话框

对话框是一个指定的窗口，它可以包含顶部的工具栏和底部的按钮。默认对话框不能 已调整大小，但用户可以将resizable属性设置为true以使其可调整大小.

创建对话框

对话框非常简单，它可以从DIV标记创建，就像这样:

<div id="dd" class="easyui-dialog" style="padding:5px;width:400px;height:200px;" title="My Dialog" iconCls="icon-ok" toolbar="#dlg-toolbar" buttons="#dlg-buttons"> 对话框的内容。 </div>

准备工具栏和按钮

<div id="dlg-toolbar"> <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:alert('Add')">Add</a> <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:alert('Save')">Save</a> </div> <div id="dlg-buttons"> <a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="javascript:alert('Ok')">Ok</a> <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dd').dialog('close')">Cancel</a> </div>

上面的代码我们创建了一个带有工具栏和按钮的对话框。这是对话框、工具栏、内容和按钮的标准配置.

下载 EasyUI 实例: