tab右键关闭菜单项重复

项目中使用到ext创建tab页，想右键tab页title可以选择关闭此tab页，但是创建的menu中关闭选项有时候会出现两个
我的代码如下
var openInTab= function(id,node,e,url) {
e.stopEvent();
var tabId=id;
var n = tabs.getComponent(tabId);
if (!n) {
var n = tabs.add({
id:tabId,
title: node.text,
closable:true,
html : ''
});
}
tabs.setActiveTab(n);
}
//生成标签页
var tabs = new Ext.TabPanel({
region:'center',
animScroll:true,
deferredRender:false,
activeTab:0,
resizeTabs:false, // turn on tab resizing
// minTabWidth: 20,
// tabWidth: 30,
enableTabScroll:true
,
items:[
{
id:'main',
title: '首页',
html: ''
}
]

});

Ext.BLANK_IMAGE_URL = 'js/ext-3.0.0//resources/images/default/s.gif'
Ext.onReady( function() {
var viewport = new Ext.Viewport({
layout:'border',
items:[
new Ext.BoxComponent({
region:'north',
el: 'north',
height:72
}),{
region:'west',
id:'west-panel',
split:true,
width: 200,
minSize: 175,
maxSize: 600,
margins:'0 0 0 0',
layout:'accordion',
title:'系统菜单',
collapsible :true,
layoutConfig:{
animate:true
},
items: [
{
title:' ',
border:false,
html:'

'
//iconCls:'nav'
}]
},
tabs//初始标签页
]
});
var tree = new Ext.tree.TreePanel( {
el :'tree',
autoScroll:true,
rootVisible:true,
loader:new Ext.tree.TreeLoader({dataUrl:'menu.action'})
});

    var root = new Ext.tree.AsyncTreeNode( {
        id :'0',
        text :'根目录',
        expanded:true
    });
    tree.setRootNode(root);
    tree.render();
    tree.expand();
    //树的单击事件
    tree.on('click',function(node,e){
        var id=node.id;
        if(node.isLeaf()){
            var url=node.attributes.url;
            openInTab(id,node,e,url);
        }

    });

    tabs.on('contextmenu',function(tabs,tab,e){
        if(tab.id=='main'){
            return false;
        }
        var position=e.getXY();
        e.preventDefault();
        var tabContextMenu = new Ext.menu.Menu({
            id :'tabContextMenu'
        });
        var tabId=tab.id;
        tabContextMenu.addItem(new Ext.menu.Item({
            id :'close',
            text :'关闭',
            handler : function() {
                tabs.remove(tabId);
            }
        }));
        tabContextMenu.addItem(new Ext.menu.Item({
            id :'closeothers',
            text :'关闭其他',
            handler : function() {
                var items=tabs.items;
                var tabCount=items.getCount();
                var tabIds=new Array();
                var j=0;
                for(var i=0;i<tabCount;i++){
                    var item=items.get(i);
                    if(item.id!=tabId&&item.id!='main'){
                        tabIds[j]=item.id;
                        j++;
                    }

                }
                for(var k=0;k<tabIds.length;k++){
                    tabs.remove(tabIds[k]);
                }
            }
        }));
        tabContextMenu.showAt(position);
    });

});[img]http://dl.iteye.com/upload/attachment/332120/9aa7d14a-83fa-353f-b2c0-410419606671.png[/img]
不知道是什么地方有问题

这种情况一般是id的原因
官方已经有这个tab右键的插件了
在ux包下有个 TabCloseMenu.js
代码：
[code="java"]/*!

• Ext JS Library 3.2.0
• Copyright(c) 2006-2010 Ext JS, Inc.
• licensing@extjs.com
• http://www.extjs.com/license / /*
• @class Ext.ux.TabCloseMenu
• @extends Object
• Plugin (ptype = 'tabclosemenu') for adding a close context menu to tabs. Note that the menu respects
• the closable configuration on the tab. As such, commands like remove others and remove all will not
• remove items that are not closable.
• @constructor
• @param {Object} config The configuration options

• @ptype tabclosemenu
  /
  Ext.ux.TabCloseMenu = Ext.extend(Object, {
  /*

  • @cfg {String} closeTabText
  • The text for closing the current tab. Defaults to 'Close Tab'. */ closeTabText: 'Close Tab',

  /**

  • @cfg {String} closeOtherTabsText
  • The text for closing all tabs except the current one. Defaults to 'Close Other Tabs'. */ closeOtherTabsText: 'Close Other Tabs',

  /**

  • @cfg {Boolean} showCloseAll
  • Indicates whether to show the 'Close All' option. Defaults to true. */ showCloseAll: true,

  /**

  • @cfg {String} closeAllTabsText

  • The text for closing all tabs. Defaults to 'Close All Tabs'. */ closeAllTabsText: 'Close All Tabs',

  constructor : function(config){
  Ext.apply(this, config || {});
  },

  //public
  init : function(tabs){
  this.tabs = tabs;
  tabs.on({
  scope: this,
  contextmenu: this.onContextMenu,
  destroy: this.destroy
  });
  },

  destroy : function(){
  Ext.destroy(this.menu);
  delete this.menu;
  delete this.tabs;
  delete this.active;
  
  },

  // private
  onContextMenu : function(tabs, item, e){
  this.active = item;
  var m = this.createMenu(),
  disableAll = true,
  disableOthers = true,
  closeAll = m.getComponent('closeall');

  m.getComponent('close').setDisabled(!item.closable);
  tabs.items.each(function(){
      if(this.closable){
          disableAll = false;
          if(this != item){
              disableOthers = false;
              return false;
          }
      }
  });
  m.getComponent('closeothers').setDisabled(disableOthers);
  if(closeAll){
      closeAll.setDisabled(disableAll);
  }
  
  e.stopEvent();
  m.showAt(e.getPoint());
  

  },

  createMenu : function(){
  if(!this.menu){
  var items = [{
  itemId: 'close',
  text: this.closeTabText,
  scope: this,
  handler: this.onClose
  }];
  if(this.showCloseAll){
  items.push('-');
  }
  items.push({
  itemId: 'closeothers',
  text: this.closeOtherTabsText,
  scope: this,
  handler: this.onCloseOthers
  });
  if(this.showCloseAll){
  items.push({
  itemId: 'closeall',
  text: this.closeAllTabsText,
  scope: this,
  handler: this.onCloseAll
  });
  }
  this.menu = new Ext.menu.Menu({
  items: items
  });
  }
  return this.menu;
  },

  onClose : function(){
  this.tabs.remove(this.active);
  },

  onCloseOthers : function(){
  this.doClose(true);
  },

  onCloseAll : function(){
  this.doClose(false);
  },

  doClose : function(excludeActive){
  var items = [];
  this.tabs.items.each(function(item){
  if(item.closable){
  if(!excludeActive || item != this.active){
  items.push(item);
  }
  
  }
  }, this);
  Ext.each(items, function(item){
  this.tabs.remove(item);
  }, this);
  }
  });

Ext.preg('tabclosemenu', Ext.ux.TabCloseMenu);[/code]

使用范例：
tab = new Ext.TabPanel({
activeTab:0,
resizeTabs:true, // turn on tab resizing
minTabWidth: 115,
tabWidth:135,
enableTabScroll:true,
items:[{
iconCls:'desk',
title:"title"
}],
[color=red]plugins: new Ext.ux.TabCloseMenu()[/color]
})

看到插件里面的这段代码没？
createMenu : function(){

if(!this.menu){

var items = [{

itemId: 'close',

text: this.closeTabText,

scope: this,

handler: this.onClose

}];

if(this.showCloseAll){

items.push('-');

}

items.push({

itemId: 'closeothers',

text: this.closeOtherTabsText,

scope: this,

handler: this.onCloseOthers

});

if(this.showCloseAll){

items.push({

itemId: 'closeall',

text: this.closeAllTabsText,

scope: this,

handler: this.onCloseAll

});

}

this.menu = new Ext.menu.Menu({

items: items

});

}

return this.menu;

},

只是创建一次