js实现右键菜单功能
本文解决的问题：1、实现右键菜单功能代码；2、阻止默认事件的实际应用。
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>右键菜单</title>
<styletype="text/css">
#menu{
position:fixed;
left:0;
top:0;
width:200px;
height:400px;
background-color:blue;
display:none;
}
</style>
</head>
<body>
<divid="menu">
</div>
<scripttype="text/javascript">
varmenu=document.getElementById("menu");
document.oncontextmenu=function(e){
vare=e||window.event;
//鼠标点的坐标
varoX=e.clientX;
varoY=e.clientY;
//菜单出现后的位置
menu.style.display="block";
menu.style.left=oX+"px";
menu.style.top=oY+"px";
//阻止浏览器默认事件
returnfalse;//一般点击右键会出现浏览器默认的右键菜单，写了这句代码就可以阻止该默认事件。
}
document.onclick=function(e){
vare=e||window.event;
menu.style.display="none"
}
menu.onclick=function(e){
vare=e||window.event;
e.cancelBubble=true;
}
//document.addEventListener("contextmenu",function(e){
//vare=e||window.event;
//e.preventDefault();
//alert("menu");
//},false)
</script>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。