JS根据右键点击位置弹出右键菜单

项目中遇到,记录一下。

Echarts4鼠标右键的点击事件
myChart.on('contextmenu', showMenu);//Echarts鼠标右击事件
var tree = document.getElementById("attrs_tree_ec");//Echarts树图容器
tree.oncontextmenu = function() { return false; };//屏蔽浏览器默认右键菜单
点击事件调用的方法
function showMenu(param){
	var menu = document.getElementById("struct_menu");
	var event = param.event.event;
	handler(event);//显示菜单
	}
显示右键菜单

event是Echarts点击时获取到的参数

function handler(event){
    if(event.button == 2){// 判断是不是右键点击
    	// 当前位置弹出菜单(div)
    	$("#struct_menu").css({
			top: event.pageY,
			left: event.pageX
		}).show();    
    }
}
鼠标离开或者点击别的地方隐藏菜单
document.getElementById("struct_menu").style.display="none";//隐藏菜单
发布了9 篇原创文章 · 获赞 3 · 访问量 618

猜你喜欢

转载自blog.csdn.net/weixin_44657749/article/details/100557808