ExtJS中新增tabpanel加载其它完整页面（viewport布局中）

这个问题困扰了我两天，现在终于解决了，拿出来分享一下！

大家看看代码：

 

tree1.on('click',function(node){
    	var id=node.id;
    	var tab=Ext.getCmp('auto');
    	if(node.text == "个人资料"){
	       if(id=='information'){
	       		var tabItem=Ext.getCmp('form_information');
	       		if(tabItem==null){
					tabItem=tab.add(new Ext.Panel({
						id:"form_information",
						title:"基本信息",
						closable:true,
						autoScroll:true,
						frame:true,
						items:[{
							showMask: true,
							maskMsg: '正在加载  ',
							scripts:true,
							html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"
						}]
					}));
					tab.setActiveTab(tabItem);
				}
				else{
					tab.setActiveTab("form_information");
				}
	       		
	        }else{
	        	Ext.MessageBox.alert("error");
	        }
    	}
    	else if(node.text == "在校情况"){
    		 if(id=='schoolinfo'){
    		 	
    		 }
    	}
    });

 

 关键在：

 

tabItem=tab.add(new Ext.Panel({
						id:"form_information",
						title:"基本信息",
						closable:true,
						autoScroll:true,
						frame:true,
						items:[{
							showMask: true,
							maskMsg: '正在加载  ',
							scripts:true,
							html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"
						}]
					}));

 不要用autoLoad，加载后总是出现页面混乱。现在只需要把它换成html:" <iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='http://localhost:8080/HH/test.html'> </iframe>"即可，

是不是很简单啊？呵呵，做不出来的时候真的很烦恼的。希望对大家有帮助啊！