Ext的TabPanel页面加载总结

Ext.TabPanel中autoLoad属性可以实现异步加载一个动态或静态页面，使用一般是没有问题的，但其中有一个值得注意的地方是，如果要显示加载页面中的HTML元素等标签的话，必须在autoLoad后面加上scripts:true这个属性，请看下面代码：

var tabs = new Ext.TabPanel({
     id:"treeTab",
     border:false,
      items:[{
         title:"使用scripts属性",
          autoLoad:{
             url:"test.aspx",
            scripts:true
         }
      },{
         title:"不使用scripts属性",
          autoLoad:{
             url:"test.aspx"
         }
      }]
});

现在我们假设a.jsp中内容为一个文本输入框，代码如下：

姓名：<input type="text">

那么当激活上面两个TAB后加载得到的内容是有区别的，

使用scripts:true属性的，其加载后显示的是“姓名：”加一个文本框，而不使用的话显示的只有“姓名：”

通常情況下，最好，速度最快的方法是在TabPanel的Items屬性中設置autoLoad： 

autoLoad:{ 
    url:'a.jsp', 
    scripts:true 
} 
但如果被加載的頁面a.jsp中有Ext.OnReady()方法的話，則無法顯示OnReady中加載的界面，所以只能用iframe進行加載，也就是第二種方法： 
frame:true, 
html:'<iframe src="a.jsp" width="100%" height=486 ></iframe>' 

此種方法在加載時，如果a.jsp頁面中包含了引用ext-all.js或者ext相關的js文件的話，每打開一個Tab，則完整加載一次所有ext相關的js文件，將嚴重影響效率。