|
也許，只有當(dāng)做比較大的項(xiàng)目的時(shí)候,，才會(huì)發(fā)現(xiàn)封裝好的東西會(huì)為程序猿們帶來(lái)多少方便,。合作開(kāi)發(fā)的時(shí)候更應(yīng)該強(qiáng)調(diào)復(fù)用，才能更加發(fā)揮團(tuán)隊(duì)的優(yōu)勢(shì),。 今天使用了一些EasyUI,發(fā)現(xiàn)很wonderful! 比如,，以前，我們?yōu)榱藢懸粋€(gè)還看得過(guò)去的按鈕,，得先在HTML里面加入按鈕,，然后在CSS里面寫入樣式，又用JS控制它的事件,，整個(gè)按鈕寫下來(lái),，我們已經(jīng)快被煩死了，抬起頭看看,，我們還有l(wèi)abel,dropList,text......等N多個(gè)這樣的東西要寫,。后來(lái)有了JQuery了，我們的日子似乎好過(guò)了點(diǎn)兒,，嘗試過(guò)EasyUI,忽然就又體會(huì)到了封裝的好處,。 ok,開(kāi)始進(jìn)入正題，本文主要是簡(jiǎn)介在使用EasyUI進(jìn)行開(kāi)發(fā)時(shí),，要引入那些東西,，以及一些注意事項(xiàng)，還有運(yùn)行下我們的dialog版的“hello world” . 如下代碼,，我們首先要引入我們的Jquery,這個(gè)jquery的版本最好跟EasyUI里面使用的Jquery版本一至,，以免出現(xiàn)我們使用EasyUI時(shí)莫名其妙的錯(cuò)誤。 然后引入的是EasyUI的JS文件,，注意,，這兩個(gè)JS文件都要指定charset. 接著是CSS文件的引入，我們選擇如下的CSS文件：
接著是Icon,，接著是漢化包：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www./1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>EasyUI入門</title> </head> <script language="JavaScript" type="text/javascript" src="../jquery-easyui-1.2.6/jquery-1.7.2.min.js" charset="utf-8"></script> <!--(指定編碼方式,，防止出現(xiàn)亂碼)引入EasyUI中使用的Jquery版本--> <script language="JavaScript" type="text/javascript" src="../jquery-easyui-1.2.6/jquery.easyui.min.js" charset="utf-8"></script> <!--(指定編碼方式，防止出現(xiàn)亂碼)引入EasyUi文件--> <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.2.6/themes/default/easyui.css"> <!--引入CSS樣式--> <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.2.6/themes/icon.css"> <!--Icon引入--> <script language="JavaScript" type="text/javascript" src="../jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js"></script> <!--漢化--> <script> </script> <body> <!--此處,，class="easyui-dialog" 要注意,，在EasyUi里面，Parser會(huì)將easyui-+****的div轉(zhuǎn)換為元件,不能省去--> <div id="dd" class="easyui-dialog" style="padding:5px;width:400px;height:200px;" title="這是我第一次使用EasyUI" iconCls="icon-ok" toolbar="#dlg-toolbar" buttons="#dlg-buttons"> hello world! </div> </body> </html> 所有文件引入完成之后,，我們從官網(wǎng)上粘段代碼來(lái)看看EasyUI的效果：
在瀏覽器中看到結(jié)果如圖：
|
|
|
