1.2　jQuery EasyUI的初步使用

1.2.1　下載及版本說明

EasyUI有兩個版本供開發者使用，一個是免費版、一個是商用版。本書將使用免費版1.5.4進行開發講解【相關資源見隨書資料：\資源\jquery-easyui-1.5.4.4.zip】。如果讀者需要使用其他版本，可以訪問http://www.jeasyui.com/download/index.php自行下載。

EasyUI解壓后部分文件說明如下：

• themes：該文件夾中存放的是EasyUI應用的主題以及圖標樣式，本書示例中默認使用default主題。
• jquery.easyui.min.js：EasyUI的核心文件，其中集成了一系列的UI插件。
• jquery.easyui.mobile.js：開發移動端應用時需要引入的文件。
• jquery.min.js：jQuery插件。

1.2.2　直接在HTML中使用

開發者可以在HTML中定義EasyUI組件，此時只需要在class屬性中定義組件的類別，在data-options中定義組件的配置，如下代碼所示：

01  <div class="easyui-dialog" style="width:400px;height:200px"
02      data-options="
03          title:'My Dialog',
04          iconCls:'icon-ok',
05          onOpen:function(){}">
06      dialog content.
07  </div>

1.2.3　使用Javascript創建

開發者也可以通過JavaScript來創建EasyUI組件，如下代碼所示：

01  <input id="cc" style="width:200px" />
02  $('#cc').combobox({
03       url: ...,
04       required: true,
05       valueField: 'id',
06       textField: 'text'
07  });