extjs4 Ext.tab.Panel

本文介绍了ExtJS中TabPanel组件的基本使用方法,包括创建、配置及如何通过API操作TabPanel,例如显示、隐藏和切换选项卡等。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >


var tabs = Ext.create("Ext.tab.Panel",{
width:300,
height:200,
activeTab:0,
items:[{
title:"Home",
itemId:"home",
html:"Home"
},{
title:"User",
itemId:"user",
html:"user",
//hidden:true
},{
title:"Tickes",
itemId:"tickes",
html:"tickes"
}],
renderTo:Ext.getBody()
});

setTimeout(function(){
tabs.child("#home").tab.hide();
var user = tabs.child("#user");
user.tab.show();
tabs.setActiveTab(user);
},1000);

extjs4 和 extjs3.x 在创建对象的时候有个明显的区别,那就是:extjs4 用Ext.create()来生成对象。

tabpanel 的常用属性:
tabPosition: 设置tab的位置,
下面来学习item常用的属性:
title: 标题
itemId: item的 id
html:页面显示的内容,可以是普通字符和html代码
hidden:设置item是否隐藏

tabpanel 的方法
child():获取tabs的子节点,参数为itemId。

var user = tabs.child("#user");
user.tab.show();
tabs.setActiveTab(user);

如上:可以通过id=“user”来获取tabs的子节点,在通过子节点获取tab。
并且可以通过 tabs.items.items[0]这样的语句来获得tab。

close():关闭一个tab,如下面代码,关闭第一个tab
tabs.items.items[0].close();

add():增加一个tab
remove():删除一个tab
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值