详解jQuery EasyUI Layout(Tabs)中文参考手册

[日期：2010-04-26]来源：???? 作者：[字体：大?中?小]

?

本文和大家讲下jQuery EasyUI中Layout(Tabs)，即标签的应用手册参考。

效果：

创建一个tab标签

使用说明

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

?Code?[http://www.oeedu.com]

<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代码?Code?[http://www.oeedu.com]

//创建一个标签容器   $('#tt').tabs(options);     //增加一个tab面板   $('#tt').tabs('add',{       title:'New Tab',       content:'Tab Body',       closable:true  }); 

下面是属性参考。

?

Tabs Container特性说明widthnumber标签容器宽度autoheightnumber标签容器高度autoidSeednumber应该是生成标签面板的基本id0plainboolean设置true，标签栏显示背景falsefitboolean设置true，自适应父集容器大小falseborderboolean标签容器边框truescrollIncrementnumber标签卷按钮被按下，滚动的像素100scrollDurationnumber滚动动画持续的毫秒400

?

?

Tabs Container事件说明idstring标签面板idnulltitlestring标签面板的title?contentstring标签面板的content.?hrefstring面板远程加载进来数据的地址.nullcacheboolean设置true，缓存标签面板trueiconstring标签面板标题上图标css。nullclosableboolean设置true，标题上显示一个关闭按钮falseselectedboolean设置true，标签面板被选中【默认那个显示在前】falsewidthnumber标签面板宽度autoheightnumber标签面板高度auto