ExtJs TabPanel右键功能插件

下面是ExtJs TabPanel右键功能插件，可以全部关闭Tab，或者关闭除自己的其它Tab，可以关闭当前Tab等功能。

Js代码


Ext.ux.TabCloseMenu = function(){

var tabs, menu, ctxItem;

this.init = function(tp){

tabs = tp;

tabs.on('contextmenu', onContextMenu);

}

function onContextMenu(ts, item, e){

if(!menu){ // create context menu on first right click

menu = new Ext.menu.Menu([{

id: tabs.id + '-close',

text: syscommon.closetab,

handler : function(){

tabs.remove(ctxItem,false);

}

},{

id: tabs.id + '-close-others',

text:syscommon.closealltab,

handler : function(){

tabs.items.each(function(item){

if(item.closable && item != ctxItem){

tabs.remove(item,false);

}

});

}

},{

id: tabs.id + '-close-all',

text: syscommon.closeothertab,

handler : function(){

tabs.items.each(function(item){

if(item.closable){

tabs.remove(item,false);

}

});

}

}]);

}

ctxItem = item;

var items = menu.items;

items.get(tabs.id + '-close').setDisabled(!item.closable);

var disableOthers = true;

tabs.items.each(function(){

if(this != item && this.closable){

disableOthers = false;

return false;

}

});

items.get(tabs.id + '-close-others').setDisabled(disableOthers);

var disableAll = true;

tabs.items.each(function(){

if(this.closable){

disableAll = false;

return false;

}

});

items.get(tabs.id + '-close-all').setDisabled(disableAll);

menu.showAt(e.getPoint());

}

};

使用方法很简单：

在TabPanel上加上这句，plugins : new Ext.ux.TabCloseMenu()