Ext应用三 -- Tab

Ext应用三 -- Tab

简单tab的应用，参考例子

     var  tabs  =   new  Ext.TabPanel( {
        renderTo: 'tabs1',
        width:450,
        activeTab: 0,
        frame:true,
        defaults:{autoHeight: true},
        items:[
            {contentEl:'script', title: 'Short Text'},
            {contentEl:'markup', title: 'Long Text'}
        ]
    } );

tab的激活事件
在item的配置中增加
    listeners: {activate: handleActivate}
handleActivate是一个方法，也就是当激活某一个tab的时候，就会调用这个方法。

     //  second tabs built from JS
     var  tabs2  =   new  Ext.TabPanel( {
        renderTo: document.body,
        activeTab: 0,
        width:600,
        height:250,
        plain:true,
        defaults:{autoScroll: true},
        items:[{
                title: 'Normal Tab',
                html: "My content was added during construction."
            },{
                title: 'Ajax Tab 1',
                autoLoad:'ajax1.htm'
            },{
                title: 'Ajax Tab 2',
                autoLoad: {url: 'ajax2.htm', params: 'foo=bar&wtf=1'}
            },{
                title: 'Event Tab',
                listeners: {activate: handleActivate},
                html: "I am tab 4's content. I also have an event listener attached."
            },{
                title: 'Disabled Tab',
                disabled:true,
                html: "Can't see me cause I'm disabled"
            }
        ]

    } );

autoLoad:异步载入的页面。