jQuery EasyUI Chinesisches Referenzhandbuch
/ jEasyUI自定義對(duì)話框
jEasyUI自定義對(duì)話框
您可以創(chuàng)建一個(gè)帶有工具欄(toolbar)和按鈕(button)的對(duì)話框(dialog),可以從 HTML 標(biāo)記創(chuàng)建。這個(gè)教程描述如何添加工具欄(toolbar)和按鈕(button)到對(duì)話框(dialog),沒(méi)有任何的 javascript 代碼。

創(chuàng)建對(duì)話框(Dialog)
<div id="dd" class="easyui-dialog" title="My Dialog" style="width:400px;height:200px;padding:10px" toolbar="#dlg-toolbar" buttons="#dlg-buttons"> Dialog Content. </div>
創(chuàng)建工具欄(Toolbar)
<div id="dlg-toolbar"> <table cellpadding="0" cellspacing="0" style="width:100%"> <tr> <td> <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true">Edit</a> <a href="#" class="easyui-linkbutton" iconCls="icon-help" plain="true">Help</a> </td> <td style="text-align:right"> <input></input><a href="#" class="easyui-linkbutton" iconCls="icon-search" plain="true"></a> </td> </tr> </table> </div>
創(chuàng)建按鈕(Buttons)
<div id="dlg-buttons"> <table cellpadding="0" cellspacing="0" style="width:100%"> <tr> <td> <img src="../style/images/email.gif"/> </td> <td style="text-align:right"> <a href="#" class="easyui-linkbutton" iconCls="icon-save" onclick="javascript:alert('save')">Save</a> <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dd').dialog('close')">Close</a> </td> </tr> </table> </div>
請(qǐng)注意,對(duì)話框(dialog)的工具欄(toolbar)和按鈕(buttons)屬性也可以通過(guò) string 值指定,它將充當(dāng)作為一個(gè)選擇器去選擇一個(gè)適當(dāng)?shù)?DIV 元素,并追加到工具欄(toolbar)或者按鈕(buttons)的位置。
下載 jQuery EasyUI 實(shí)例
jeasyui-win-dlg2.zip