jQuery EasyUI 中文API Layout(Tabs)

更新時間：2010年04月27日 23:16:24 作者：

發(fā)布jQuery EasyUI 中文API—Layout(Tabs)總結，需要的朋友可以參考下。

Tabs【標簽】

創(chuàng)建一個tab標簽

使用說明
使用到的頭文件：easyui.css、icon.css、jquery-1.4.2.min.js、jquery.easyui.min.js

html

復制代碼代碼如下:

 
<div id="tt" style="width:500px;height:250px;"> 
<div title="Tab1" style="padding:20px;display:none;"> 
tab1 
</div> 
<div title="Tab2" closable="true" style="overflow:auto;padding:20px;display:none;"> 
tab2 
</div> 
<div title="Tab3" icon="icon-reload" closable="true" style="padding:20px;display:none;"> 
tab3 
</div> 
</div> 

JQuery代碼

復制代碼代碼如下:

 
//創(chuàng)建一個標簽容器 
$('#tt').tabs(options); 

//增加一個tab面板 
$('#tt').tabs('add',{ 
title:'New Tab', 
content:'Tab Body', 
closable:true 
}); 

Tabs Container特性說明

名稱	類型	描述	默認值
width	number	標簽容器寬度	auto
height	number	標簽容器高度	auto
idSeed	number	應該是生成標簽面板的基本id	0
plain	boolean	設置true，標簽欄顯示背景	false
fit	boolean	設置true，自適應父集容器大小	false
border	boolean	標簽容器邊框	true
scrollIncrement	number	標簽卷按鈕被按下，滾動的像素	100
scrollDuration	number	滾動動畫持續(xù)的毫秒	400

Tabs Container事件說明

名稱	參數(shù)	描述
onLoad	arguments	ajax面板加載完畢后觸發(fā)，參數(shù)調用跟jQuery.ajax調功能一樣
onSelect	title	選中標簽面板觸發(fā)
onClose	title	關閉標簽面板觸發(fā)

Tabs Container方法說明

名稱	參數(shù)	描述
resize	none	調整容器的布局
add	options	添加一個新的標簽面板,選擇一個配置對象參數(shù),看標簽面板的特性說明
close	title	關閉一個標簽面板,標題參數(shù)顯示的面板被關閉。
select	title	選中一個標簽面板
exists	title	指明特殊面板顯示存在。

Tab Panel特性說明

名稱	類型	描述	默認值
id	string	標簽面板id	null
title	string	標簽面板的title
content	string	標簽面板的content.
href	string	面板遠程加載進來數(shù)據(jù)的地址.	null
cache	boolean	設置true，緩存標簽面板	true
icon	string	標簽面板標題上圖標css。	null
closable	boolean	設置true，標題上顯示一個關閉按鈕	false
selected	boolean	設置true，標簽面板被選中【默認那個顯示在前】	false
width	number	標簽面板寬度	auto
height	number	標簽面板高度	auto