有时候需要给普通面板Panel添加个右键菜单,但 [ for a panel does not have 'contextmenu' event, need to use the DOM event on the Panel's body Element ], 示例:
// 定义一个有右键菜单的Panel
var panelwithCtxMenu = new Ext.Panel({
renderTo: Ext.getBody(),
title: "demo of panel",
width: 500,
height: 200,
html: "to show a contextmenu....."
});
// 添加右键菜单
panelwithCtxMenu.getEl().dom.oncontextmenu = function(evtObj){
// 有些浏览器不支持参数evtObj, 可以使用window.event来获取右键事件
var evt = (evtObj == null ? window.event : evtObj);
// 屏蔽浏览器默认的右键菜单
evt.preventDefault();
//定义要显示的菜单
var menu = new Ext.menu.Menu({
items: [
{
text: "Menu one",
handler: function(){
alert("hello");
}
}
]
});
// 右键菜单的显示位置 -- 用 clientX, clientY
menu.showAt([evt.clientX, evt.clientY]);
}