原創|使用教程|編輯:龔雪|2016-05-17 09:17:24.000|閱讀 352 次
概述:對話框是一個特殊的窗口,可以包含在頂部的工具欄和底部的按鈕中。本教程主要為大家介紹如何創建對話框。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
Kendo UI for jQuery——創建現代Web應用程序的最完整UI庫!查看詳情>>>
對話框是一個特殊的窗口,可以包含在頂部的工具欄和底部的按鈕中。默認情況下,對話框不能改變大小,但是用戶可以將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"> 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示例:
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:慧都控件網