
ExtonReady(function(){
var i = 4 ;
//注意:每个Tab标签只渲染一次
var tabs = new ExtTabPanel({
renderTo: ExtgetBody(),//绑定在body标签上
activeTab: 0,//初始显示第几个Tab页
deferredRender: false,//是否在显示每个标签的时候再渲染标签中的内容默认true
tabPosition: 'top',//表示TabPanel头显示的位置,只有两个值top和bottom默认是top
enableTabScroll: true,//当Tab标签过多时,出现滚动条
items: [{//Tab的个数
title: 'Tab 1',
html: 'A simple tab',
listeners: {render:function(){//为每个Tab标签添加监听器当标签渲染时触发
ExtMsgalert("Tab 1","渲染Tab 1成功") ;
}}
},{
title: 'Tab 2',
html: 'Another one',
listeners: {render: myRender}
},{
title: 'Tab 3',
autoLoad: 'testhtml',
closable: true,
listeners: {render: myRender}
}],
bbar:[{//添加一个底部工具栏,并且在该工具栏上添加两个按钮
text:'添加标签',
handler:function(){//添按钮被点击时触发这个匿名函数(注意:该属性在button中能查到)
var id = i ;
tabsadd({//添加一个Tab标签
id: id,
title:'Tab '+i,
closable: true
}) ;
i=i+1;
tabssetActiveTab(id) ;//当id为"id"的Tab标签显示(变为活动标签)
}
},{
text:'删除标签',
handler: function(){
var t = tabsgetActiveTab();//获得当前活动标签的引用
if(tclosable){
tabsremove(t);//删除标签
}else{
ExtMsgalert("提示","该标签不能关闭") ;
}
}
}]
});
//把TabPanel组件充满整个body容器
new ExtViewport({
layout: 'fit',
items: tabs
});
});
以上就是关于extjs怎么设置tabpanel详解全部的内容,包括:extjs怎么设置tabpanel详解、、等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)