Tabs【标签】 {#content}
创建一个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代码
++复制代码++ 代码如下:
//创建一个标签容器
$('#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 | 滚动动画持续的毫秒 | 400 | |
Tabs Container事件说明
| 名称 | 参数 | 描述 | |----------|-----------|-------------------------------------| | onLoad | arguments | ajax面板加载完毕后触发,参数调用跟jQuery.ajax调功能一样 | | onSelect | title | 选中标签面板触发 | | onClose | title | 关闭标签面板触发 |
Tabs Container方法说明
| 名称 | 参数 | 描述 | |--------|---------|----------------------------------| | resize | none | 调整容器的布局 | | add | options | 添加一个新的标签面板,选择一个配置对象参数,看标签面板的特性说明 | | close | title | 关闭一个标签面板,标题参数显示的面板被关闭。 | | select | title | 选中一个标签面板 | | exists | title | 指明特殊面板显示存在。 |
Tab Panel特性说明
| 名称 | 类型 | 描述 | 默认值 | |----------|---------|--------------------------|---------| | id | string | 标签面板id | null | | title | string | 标签面板的title | | | content | string | 标签面板的content. | | | href | string | 面板远程加载进来数据的地址. | null | | cache | boolean | 设置true,缓存标签面板 | true | | icon | string | 标签面板标题上图标css。 | null | | closable | boolean | 设置true,标题上显示一个关闭按钮 | false | | selected | boolean | 设置true,标签面板被选中【默认那个显示在前】 | false | | width | number | 标签面板宽度 | auto | | height | number | 标签面板高度 | auto |
有些觉得翻译的牵强,肯定也有错的地方,谢谢指出来。