×

jQuery EasyUI 中文API Layout(Tabs)

作者:Terry2017.02.04来源:Web前端之家浏览:9112评论:0
关键词:JQueryJS

Tabs【标签】


创建一个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特性说明

名称类型描述默认值
widthnumber标签容器宽度auto
heightnumber标签容器高度auto
idSeednumber应该是生成标签面板的基本id0
plainboolean设置true,标签栏显示背景false
fitboolean设置true,自适应父集容器大小false
borderboolean标签容器边框true
scrollIncrementnumber标签卷按钮被按下,滚动的像素100
scrollDurationnumber滚动动画持续的毫秒400

Tabs Container事件说明

名称参数描述
onLoadargumentsajax面板加载完毕后触发,参数调用跟jQuery.ajax调功能一样
onSelecttitle选中标签面板触发
onClosetitle关闭标签面板触发

Tabs Container方法说明

名称参数描述
resizenone调整容器的布局
addoptions添加一个新的标签面板,选择一个配置对象参数,看标签面板的特性说明
closetitle关闭一个标签面板,标题参数显示的面板被关闭。
selecttitle选中一个标签面板
existstitle指明特殊面板显示存在。

Tab Panel特性说明

名称类型描述默认值
idstring标签面板idnull
titlestring标签面板的title 
contentstring标签面板的content. 
hrefstring面板远程加载进来数据的地址.null
cacheboolean设置true,缓存标签面板true
iconstring标签面板标题上图标css。null
closableboolean设置true,标题上显示一个关闭按钮false
selectedboolean设置true,标签面板被选中【默认那个显示在前】false
widthnumber标签面板宽度auto
heightnumber标签面板高度auto

 

有些觉得翻译的牵强,肯定也有错的地方,谢谢指出来。

您的支持是我们创作的动力!
温馨提示:本文作者系Terry ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://jiangweishan.com/article/svg1486137600525.html

网友评论文明上网理性发言已有0人参与

发表评论: