EasyUI是一套使用JQuery的UI工具,可以節省開發時間,先說明如何安裝到我們的WEB上面
1. 請先下載EasyUI
在上方的功能列中按「Download』,進入下載頁面
裡面有免費版和商用版可以下載,我們選免費版(Freeware Edition),按下「Download』
這時它就會下載最新版的EasyUI到你的電腦,如果你想下載舊版本,也可以選擇Other Versions,裡面有各種版本,依需求下載.
2. 找到下載的zip檔,將它解壓縮.
3. 把解壓縮後的整個目錄(例如 jquery-easyui-1.5)改成 easyui,這樣比較簡潔.
4. 將改名後的easyui目錄整個複製到你的WEB root資料來下.
5. 在WEB root資料夾下新增一個index.html的文件,並將內容改成以下
<!DOCTYPE html>
<html>
<head>
<title>jQuery Easy UI</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="easyui/locale/easyui-lang-zh_TW.js"></script>
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
</head>
<body>
<div class="easyui-dialog" style="width:400px;height:200px"
data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}">
dialog content.
</div>
</body>
</html>
6. 使用瀏覽器去訪問你的WEB,你就能看到頁面上會出現一個對話框,它還能收放,這樣就完成EasyUI的安裝了.
至於其他的應用,再以後介紹.
本文參考李炎恢EasyUI視頻實作,記錄步驟備忘.
留言列表
綜合知識 (3)
