jEasyUI 創(chuàng)建對話框

對話框（Dialog）是一個特殊的窗口（window），可以包含在頂部的工具欄和在底部的按鈕。默認情況下，對話框（Dialog）不能改變大小，但是用戶可以設置 resizable 屬性為 true，使其可以改變大小。

創(chuàng)建對話框（Dialog）

對話框（Dialog）非常簡單，可以從 DIV 標記創(chuàng)建，如下所示：

????<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">
????????Dialog Content.
????</div>

準備工具欄（Toolbar）和按鈕（Button）

????<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>

上面的代碼我們創(chuàng)建了一個帶有工具欄（toolbar）和按鈕（button）的對話框（dialog）。這是對話框（dialog）、工具欄（toolbar）、內(nèi)容（content）和按鈕（buttons）的標準配置。

上一篇：jEasyUI 窗口與布局下一篇：jEasyUI 自定義對話框