Ext.create('Ext.tab.Panel', {
region: 'center',
id:'maintabpanel',
deferredRender: false,
activeTab: 0,
bodyStyle:'border:1px solid rgb(153,188,232)',
plugins: Ext.create('Ext.ux.TabCloseMenu'),
items: [{
contentEl: 'firstPage',
title: '首页',
closable: false,
html:''
}]
})];
var addTab = function(id,title,url){
var tabpanel = Ext.getCmp('maintabpanel');
tabpanel.remove(id);
var currentTab = tabpanel.add({id:id,title:title,closable:true,html:'<iframe frameborder="0" style="padding:0px;height:100%;display:block;width:100%;" src="' + url +'"></iframe>'});
tabpanel.setActiveTab(id);
};
一直想不通为什么iframe高度就那么一点,后来发现iframe的display为inline,恍然大悟。
分享到:
相关推荐
如果标签页本身并没有定义`loader`对象,则可以通过动态创建的方式为其添加一个`TreeLoader`实例,以实现数据的加载和刷新。 #### 关闭当前标签页 关闭当前标签页是`TabPanel`常见的需求之一,可以通过如下方式...
将选项卡组件渲染到某容器,参数类型可以为字符串,也可以为jQuery所加载的对象,如果为声明该参数,组件默认的承载容器为BODY。 items<array> 选项卡元素集合 选项卡组件渲染后就会显示的选项卡元素集合,具体参数...
4.单击节点访问页面时,在主界面TabPanel新增一个Panel,Panel下放置一个iframe,将要链 接的页面放入iframe中。 5.grid数据加载,分页,编辑删除。 6.用户列表页面点编辑时,在父页面的TabPanel中增加一个标签,下...
具体来看,代码首先定义了一个名为var p_center的Ext.TabPanel对象,这个对象被配置为在中心区域内显示,并具有调整大小、最小宽度、默认宽度、高度、自动滚动等属性。接着在items数组中,开发者添加了一个具有xtype...
通过`addTab`函数可以动态添加新的Tab,并且每个Tab都可以通过iframe加载不同的页面。 通过以上步骤,我们可以有效地部署和使用ExtJs框架,实现丰富的用户界面和交互功能。这对于构建现代化的企业级应用来说是非常...
5. TabPanel(选项卡组件):模仿EXT的TabPanel,提供灵活的选项卡管理功能,包括设置渲染位置、宽度、高度、边框样式、默认激活项以及动态添加、删除和操作选项卡。 二、选项卡组件(TabPanel)参数详解: - ...
var tabPanel = new Ext.TabPanel({ activeTab: 0, // 激活第一个Tab region: 'center', // 将TabPanel放置在中央区域 layoutOnTabChange: false, // 是否在切换Tab时重新布局 deferredRender: true, // 延迟...
5. **TabPanel (模仿EXT的Tab选项卡)**:TabPanel插件用于实现类似EXT库的选项卡组件,可以轻松创建带有多个面板的界面,每个面板代表一个选项卡。它提供了丰富的配置选项,如渲染位置、尺寸、边框显示、默认激活的...
- **height**:选项卡组件中页面显示层的高度,默认300px。 - **border**:是否显示边框,默认显示,可设置为"none"隐藏边框。 - **active**:渲染后默认激活哪个选项卡元素,默认为0。 - **maxLength**:最多显示几...