Extjs4---tab选项卡--基本选项卡

欢迎光临我的小站，共同学习交流技术：http://www.luchg.com

完整代码下载地址：http://download.csdn.net/detail/lc448986375/4582794

1、基本的选项卡

tabPanel.html:

  
  	
    
    
    
	
    

  
  
  
  	

  		

  			从页面的div中传入的数据
  		
  	
  

tabPanel.js

Ext.require(
		'Ext.tab.*'
);
Ext.onReady(
		
		
		
		function(){
			Ext.create(
					'Ext.tab.Panel',
					{
						renderTo:Ext.getBody(),
						activeTab:0,
						width:600,
						height:300,
						plain:true,
						defaults:{
							autoScoll:true
						},
						items:[
						       {
						    	   //id:'tab1',
						    	   title:'Tabs-1',
						    	   html:'这是一个普通的tab'
						       },{
						    	   title:'tab-2',
						    	   contentEl:'tab2'
						       },{
						    	   //id:'tab2',
						    	   title:'ajax Tab',
						    	   autoLoad:{
						    		   url:'tabAction',
						    		   params:{
						    			   data:'从客户端传入的参数'
						    		   },
						    		   method:'GET'
						    	   }
						       
						       },{
						    	   title:'事件tab',
						    	   listeners:{
						    		   activate:function(tab){
						    			   alert(tab.title + ': activate事件触发。');
						    		   }
						    	   },
						    	   html:'带事件的tab',
						    	   autoLoad:false
						       },{
						    	   title:'不可用的tab',
						    	   disabled: true
						       }
						]
					}
			);
		}
);

效果图：