EasyUI簡單使用介紹

2021-07-25 21:37:30 字數 1034 閱讀 7732

//引入jquery 核心庫,這裡採用的是2.0//引入jquery easyui 核心庫,這裡採用的是1.3.6//引入easyui 中文提示資訊//引入自己開發的js 檔案//引入easyui 核心ui 檔案css

//引入easyui 圖示檔案

ps:引入完畢後,我們就可以編寫jquery easyui **了。

載入ui 元件有兩種方式:1.使用class 方式載入;2.使用js 呼叫載入。

//使用class 載入,格式為:easyui-元件名

內容部分

ps:使用了規定的格式就可以生成乙個ui 元件,這是由於jquery easyui 的乙個解析

器(parser)的起到了作用。解析之後,從firebug 裡面可以看到ui 元件變化後的html。

//使用js 呼叫載入

$('#box').dialog();

用class 的用法將極大的不方便。並且根據js 和html 分離的原則,第二種提高了**的

可讀性。

//刪除jquery easyui 的js 核心檔案及css,引入easyloader.js 檔案//js **

easyloader.load('dialog', function () );

ps:使用easyloader 智慧型載入,是根據你使用的ui 元件按需載入。我們可以通過

firebug 檢視html,發現載入了非常多的js 檔案,這些js 都是dialog 元件的必須條件。

所以,使用easyloader 載入會減少不必要的內容載入。但問題是,使用智慧型載入,你編碼

的難度和成本都提高了,效率降低,並且智慧型載入的js 檔案數量還是非常多的,並不會提

高太大的速度,反而因為js 檔案較多,被搜尋引擎要求合併優化。

easy ui 簡單使用

1 引入需要的js與css easyui核心檔案 國際化 主題檔案 主題使用的圖示 2 構造easy ui 控制項 js方式 首先建立乙個div標籤 dialog content.然後選擇div呼叫dialog就可以把普通的div渲染成easy ui的dialog控制項 function html方...

easyui簡單使用

easyui近期一直都比較流行,雖然它在效果上被extjs爆了,它的使用難度低,在ie6下表現不錯,的確受到了廣泛企業程式設計師的好評。但是他的api說明還是比較簡陋的,剛上手可能還需要摸索一下,為什麼這樣做不會來?我做了一些封裝 盡量地封裝,隱藏它的api,保持簡單呼叫。工作開始 tabs 先貼一...

EasyUI框架介紹

1.easyui是前端框架 2.前端框架 即封裝大量css和js 3.使用前端框架 即給標籤class屬性。4.easyui中需要注意的地方 a data options屬性定義easyui屬性的。b 如果easyui提供的屬性和html標籤屬性相同,可以把這個屬性不寫在data options中 ...