easyui簡單使用

easyui近期一直都比較流行，雖然它在效果上被extjs爆了，它的使用難度低，在ie6下表現不錯，的確受到了廣泛企業程式設計師的好評。

但是他的api說明還是比較簡陋的，剛上手可能還需要摸索一下，為什麼這樣做不會來？

我做了一些封裝

盡量地封裝，隱藏它的api，保持簡單呼叫。

工作開始

tabs

先貼一張簡陋的圖，與官方的demo差不多，但是在tabs中只加入乙個模仿vs的右鍵選單，並且設定了選項卡最大個數，開啟選項卡時超出最大個數會關閉乙個。

另外做了寫控制，不會重複開啟選項卡。

總體上定義乙個jeasyui的類，可以看到他包含tabs,messager,redirect這幾個部分的功能。

var jeasyui = ,                                           

//選項卡
messager: {},                                     //
訊息框    redirect:{}                                         //
重定向};

/*

選項卡id                          easyui標籤的id
maxlength             設定選項卡最大個數
*/jeasyui.tabs = function
(id, maxlength) ;
//關閉指定選項卡函式
this.closetab = function
(title) ;
//關閉除選中外所有選項卡函式
this.closealltabexceptthis = function
(title) 
}for (var j = 0; j < listcount; j++) 
};};//
新增乙個選項卡
jeasyui.tabs.prototype.addtab = function
(titlename, url) );
'src', url);
} else
};//
選中指定選項卡（引數titlename:選項卡標題名）
jeasyui.tabs.prototype.selecttab = function
(titlename) ;
//獲取當前選項卡
jeasyui.tabs.prototype.getselected = function
() ;
//重新整理選項卡（引數tab:選項卡）
jeasyui.tabs.prototype.refresh = function
(tab) ;
//驗證選項卡是否存在（引數titlename:選項卡標題名）
jeasyui.tabs.prototype.exists = function
(titlename) ;

var jtab = new jeasyui.tabs('tabs', 10);

function
addtab(obj) 
function
closecurrtab() 
function
reloadtab() 
function
closealltabexceptthis() 

$(document).ready(function

() ;
$('#aa').accordion(aaoptions);
//構建選項卡
var tabsoptions = 
else
$('#mm').menu('show', )
$('#hidcurrtab').val(title);
},onadd: 
function
(title) 
},onclose: 
function
(title) 
};$('#tabs').tabs(tabsoptions);
});

jeasyui.messager ={};

//彈出提示資訊
jeasyui.messager.alert = function
(title,msg,type) ;
//彈出提示確認後重定向
jeasyui.messager.confirmandredirect = function
(title, msg, url) 
});};//
彈出提示確認後關閉視窗
jeasyui.messager.confirmandclose = function
(title, msg) 
});};//
彈出提示資訊後父窗體重定向
jeasyui.messager.mredirect = function
(title, msg, url) );
};

easy ui 簡單使用

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

EasyUI簡單使用介紹

引入jquery 核心庫，這裡採用的是2.0 引入jquery easyui 核心庫，這裡採用的是1.3.6 引入easyui 中文提示資訊 引入自己開發的js 檔案 引入easyui 核心ui 檔案css 引入easyui 圖示檔案 ps 引入完畢後，我們就可以編寫jquery easyui 了。...

easyui使用記錄

1.easyui時間控制項 限制不能選擇未來時間 aaaj datebox datebox calendar calendar 限制開始時間小於結束時間 starttime datebox 2.datagrid載入資料 public datagrid grid mapmap 3.combobox使用...