Tabs（选项卡）
- tabs
-
- 依赖关系
- 使用案例
-
- 创建面板
-
- 1. 通过标签创建选项卡
- 2. 通过Javascript创建选项卡
- 添加新的选项卡面板
- 获取选择的选项卡
- 属性
- 事件
- 方法
- 选项卡面板
- 代码案例
tabs
使用$.fn.tabs.defaults重写默认值对象。
选项卡显示一批面板。但在同一个时间只会显示一个面板。每个选项卡面板都有头标题和一些小的按钮工具菜单，包括关闭按钮和其他自定义按钮。
依赖关系
- panel
- linkbutton
使用案例
创建面板
1. 通过标签创建选项卡
通过标签可以更容易的创建选项卡，我们不需要写任何Javascript代码。只需要给
标签添加一个类ID’easyui-tabs’。每个选项卡面板都通过子
标签进行创建，用法和panel(面板)相同。
<div id="tt" class="easyui-tabs" style="width:500px;height:250px;"> <div title="Tab1" style="padding:20px;display:none;"> tab1 </div> <div title="Tab2" data-options="closable:true" style="overflow:auto;padding:20px;display:none;"> tab2 </div> <div title="Tab3" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;display:none;"> tab3 </div>
</div> 2. 通过Javascript创建选项卡
下面的代码演示如何使用Javascript创建选项卡，当该选项卡被选择时将会触发’onSelect’事件。
$('#tt').tabs({ border:false, onSelect:function(title){ alert(title+' is selected'); }
});
添加新的选项卡面板
添加一个新的包含小工具菜单的选项卡面板，小工具菜单图标(8x8)被放置在关闭按钮之前。
// add a new tab panel