如果馮鞏的開(kāi)場(chǎng)白是“觀眾朋友們,我想死你們了”,那么我的開(kāi)場(chǎng)白是“最近一直很忙,很久沒(méi)有發(fā)文了”。
前面說(shuō)過(guò)了EXT.NET,這里順便再說(shuō)說(shuō)JQuery EasyUI。為啥我會(huì)選擇JQuery EasyUI呢?主要有以下幾點(diǎn):
- 輕量級(jí)。
- 基本的組件都用,即“麻雀雖小五臟俱全”。
- 使用簡(jiǎn)潔方便,比如支持html+js。
- 可擴(kuò)展性。
- 可維護(hù)性。世上沒(méi)有完美的產(chǎn)品,而且其對(duì)IE6的兼容性還存在一些問(wèn)題,但相比extjs,其還是很方便閱讀和修改的。
- 簡(jiǎn)單性。這既是優(yōu)點(diǎn)也是缺點(diǎn)。比如icon,自帶的就那么幾個(gè),像我這樣的懶人,就用那么幾個(gè)就夠了,extjs的圖標(biāo)選擇起來(lái)都比較麻煩。如果實(shí)在不夠用,就去extjs里面找?guī)讉€(gè)加上。再比如組件的使用,官方文檔的描述也就那么幾頁(yè),使用起來(lái),也就那么幾個(gè)方法與事件,但基本夠用了。
- 個(gè)人不喜歡固步自封,喜好使用對(duì)自己來(lái)說(shuō)有點(diǎn)神秘和陌生的技術(shù)。
- extjs如一個(gè)行動(dòng)不便的美婦,其腳本太龐大,對(duì)象太豐富,并且不利于維護(hù);ext.net如一個(gè)打扮得花枝招展的裹腳的婦女,其將extjs封裝成服務(wù)器控件,雖然其維護(hù)起來(lái)不錯(cuò),體驗(yàn)不錯(cuò),使用方便,但是我不喜歡使用服務(wù)器控件的這種方式,也不喜歡其包了一層有一層的外殼,調(diào)起問(wèn)題來(lái)從ASP.NET到EXT.NET到extjs;而easyui,則如一個(gè)清純的少女,從外表即可窺探內(nèi)心,清秀而不失美觀。
- 其他。
最近手上有個(gè)私活,于是就試試了。現(xiàn)在項(xiàng)目已經(jīng)基本完工了。那么我就來(lái)說(shuō)說(shuō)EasyUi這個(gè)系列吧。由于時(shí)間有限,會(huì)分幾篇說(shuō)(一定會(huì)說(shuō)完),而且更新時(shí)間不會(huì)固定,敬請(qǐng)諒解。
在此之前,先說(shuō)說(shuō)編寫本系列的計(jì)劃吧:
- JQuery EasyUi之界面設(shè)計(jì)——前言與界面效果(一)
- JQuery EasyUi之界面設(shè)計(jì)——通用的JavaScript(二)
- JQuery EasyUi之界面設(shè)計(jì)——母版頁(yè)以及Ajax的通用處理(三)
- JQuery EasyUi之界面設(shè)計(jì)——代碼詳解(四)
下面先從界面效果開(kāi)始吧。
首頁(yè)
首頁(yè)的樣式是扒的官網(wǎng)DEMO,但是與其不同的是,其右側(cè)是一個(gè)框架,我這里的右側(cè)換成了一個(gè)tab,對(duì)于管理系統(tǒng)來(lái)說(shuō),使用tab更方便。
內(nèi)容展現(xiàn)頁(yè)面
上面的按鈕時(shí)類型,使用的是linkbutton實(shí)現(xiàn)的特效。下面區(qū)域使用的是datagrid,查詢放在頂部工具欄。
彈出窗口
彈出窗口可以用于新增|編輯,也可以用于其他功能,這個(gè)效果與extjs的window差不多。
新增與編輯
easyui的form自帶驗(yàn)證、提交、重置與賦值,使用起來(lái)簡(jiǎn)單方便。
提示框