一舷暮、簡介
EasyUI是一套開源并基于jQuery的界面開發(fā)框架，它提供包括窗口鸳址、數(shù)據(jù)網(wǎng)格怔檩、按鈕、表單組件等一系列UI組件桨仿，非常適合后臺(tái)交互系統(tǒng)使用。EasyUI基于HTML5標(biāo)準(zhǔn)開發(fā)，以插件的形式提供組件认烁，除了框架自帶的標(biāo)準(zhǔn)組件外，還附帶有擴(kuò)展組件和主題介汹。
EasyUI既有免費(fèi)版本却嗡，也有商業(yè)版本。商業(yè)版本需要購買嘹承，但允許用戶修改版權(quán)標(biāo)識(shí)以及其他操作窗价，并提供相應(yīng)的服務(wù)。
EasyUI于2010年面世叹卷，至今已有6個(gè)年頭撼港，現(xiàn)在最新的版本號(hào)為1.4.4，框架的內(nèi)容也在不斷豐富豪娜。EasyUI省去了開發(fā)者關(guān)于界面的設(shè)計(jì)開發(fā)餐胀，而專注于業(yè)務(wù)邏輯的處理，無論是從審美角度還是從交互性等方面瘤载，EasyUI都是一款不可多得的前端框架否灾。
EasyUI的下載地址： http://www.jeasyui.com/download/list.php
二、環(huán)境部署與配置
本系列文章以EasyUI為前端框架鸣奔、PHP為Web開發(fā)語言墨技、MySql為數(shù)據(jù)庫的方式重點(diǎn)介紹EasyUI的用法。
Web服務(wù)器
web服務(wù)器我們采用集成式的WampServer（下稱wamp）挎狸，版本為2.2d扣汪，當(dāng)然也可以用2.4。wamp集成了apache锨匆、mysql和php三套軟件崭别，安裝在windows系統(tǒng)下冬筒，省去了很多apache、php等配置問題茅主，非常方便舞痰。
官方網(wǎng)站：http://www.wampserver.com/。
wamp安裝非常簡單诀姚，根據(jù)提示一路next即可响牛，除安裝路徑外，其余按照默認(rèn)內(nèi)容就可以了赫段，默認(rèn)安裝目錄為C:\wamp呀打。需要注意的是，wamp中的php 5.3是通過VC++ 2008（VC9）編譯的糯笙，因此需要VC++ 2008(VC9)的運(yùn)行庫贬丛，運(yùn)行庫下載地址如下：https://www.microsoft.com/zh-CN/download/details.aspx?id=29
IDE
程序開發(fā)平臺(tái)IDE可以根據(jù)個(gè)人喜好選定，本文使用了NetBeans IDE 8.1,下載時(shí)請(qǐng)注意選擇含有PHP和HTML5/JavaScript插件的下載包炬丸，不過這些插件也可以后續(xù)安裝瘫寝。下載地址：https://netbeans.org/downloads/
當(dāng)然也可以使用其他IDE，例如eclipse也是一種不錯(cuò)的選擇稠炬。
項(xiàng)目配置
開發(fā)項(xiàng)目前焕阿，需要對(duì)項(xiàng)目做一個(gè)規(guī)劃和配置。我們將D:\Project\作為所有項(xiàng)目的總目錄首启，在此目錄下建立各種項(xiàng)目暮屡。
服務(wù)器配置
首先啟動(dòng)wamp，并對(duì)wamp做一些必要的配置毅桃。
配置apache褒纲，點(diǎn)擊右下角托盤上wamp的圖標(biāo)，在apache目錄下選擇httpd.conf文件钥飞，進(jìn)行一些修改莺掠。
（1）將DocumentRoot "c:/wamp/www/"改成DocumentRoot "D:/Project/"读宙。
〕垢选（2）將這里寫代碼片<Directory "c:/wamp/www/">改成<Directory "D:/Project/">。
注意结闸，路徑中的斜杠與windows系統(tǒng)的斜杠是相反的唇兑。完成后點(diǎn)擊右下角wamp綠色圖標(biāo)，選擇啟動(dòng)所有服務(wù)桦锄，直到圖標(biāo)成為綠色扎附，說明wamp工作正常。
瀏覽器
EasyUI是以HTML5為標(biāo)準(zhǔn)進(jìn)行設(shè)計(jì)结耀，并且以jQuery為基礎(chǔ)留夜，因此建議使用谷歌的Chrome匙铡，F(xiàn)ireFox等瀏覽器，IE瀏覽器請(qǐng)選用IE9以上碍粥，低版本的IE瀏覽器兼容性較差慰枕。
三、EasyUI目錄結(jié)構(gòu)
以1.4.1版本為例即纲，其目錄結(jié)構(gòu)見下圖：
demo目錄存放了各種組件的樣例程序，開發(fā)者對(duì)部分組件不熟悉的博肋，可以參考該目錄下的例子程序低斋。
demo-mobile目錄和demo目錄的功能是一樣的，只是demo-mobile目錄下的例子適用于手機(jī)等移動(dòng)端設(shè)備匪凡。
locale目錄存放了語言包膊畴，EasyUI框架支持國際化，locale目錄放有中文病游、德文等23種語言包唇跨。
plugins目錄最為核心，它存放了所有組件衬衬。在技術(shù)上买猖，每個(gè)組件都以插件的形式實(shí)現(xiàn)，所以增刪組件也比較靈活滋尉，目錄下的每個(gè)js文件都是一個(gè)組件的描述與實(shí)現(xiàn)玉控。
src目錄存放了組件的源代碼。
theme目錄存放了EasyUI框架的主題和圖標(biāo)狮惜，我個(gè)人比較喜歡bootstrap主題高诺。
easyloader文件用于加載解析EasyUI框架內(nèi)的模塊。
jquery.easyui.min.js是使用EasyUI的接口文件碾篡，必須在web頁面上引入該文件才能使用EasyUI虱而。
jquery.easyui.mobile.js功能與jquery.easyui.min.js一樣，只是該文件用于移動(dòng)設(shè)備开泽。
jquery.min.js是jQuery的核心文件牡拇，EasyUI框架基于jQuery開發(fā)，必須要有jQuery的支持眼姐。
