Ext.TabPanel 动态增加标签卡的注意事项

在Ext.TabPanel 动态增加标签卡应该也算一个常见的需求，不过由于本人第一次接触，被这个不难道的问题卡了半天，特此记录一下。

添加的方法不难道，用 add(newtab),insert(index,newtab)都可以，insert的好处是可以指定插入的位置，add方法都是默认添加到最后。

添加的形式有两种：

第一种，定义一个变量，然后添加变量：

var panel=new Ext.Panel({
           id:myid,
           title:mytitle,
           html:'<iframe id="sub" name="sub"  width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>',
           closable:true
          });
          pTab.add(panel);

第二种，不定义变量，直接添加：

pTab.add({
     id:myid,
     title:mytitle,
     html:'<iframe id="sub" name="sub"  width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>',
     closable:true
}）；

从添加标签卡的角度看，两种效果是一样的，都增加成功了。但是第一种方式增加的标签卡，内部的HTML里面的元素IFRAME是无法被识别的，

用document.getElementById（）方法也是拿不到对象的。第二种方法却可以。

如果用谷歌浏览器调试也可以发现，用两种方法增加的标签卡对象的内部结构也是有差异的，第二种方法添加的标签卡对象与创建的时候添加的

标签卡对象是完成一样的，所以内部的IFRAME可以识别

 

转载于:https://www.cnblogs.com/SylvanasWindrunner/p/5412305.html