@author YHC

dialog是一個特殊的window,可以包含工具欄在頂部和按鈕在下面,但是預設的dialog不能改變大小,但是使用者可以設定resizable 屬性為true使其可以改變大小.

建立 Dialog

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

準備工具欄和按鈕

<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 示例程式碼: