现在的位置: 首页 > 综合 > 正文

Ext3 学习(7) — Panel contextmenu

2013年12月10日 ⁄ 综合 ⁄ 共 616字 ⁄ 字号 评论关闭

有时候需要给普通面板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]);
}

抱歉!评论已关闭.