<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>html菜单显示界面</title> ???<style type="text/css"> ???????*{ ???????????margin: 0; ???????????padding: 0; ???????} ???????#btn{ ???????????width: 60px; ???????????height: 30px; ???????????background-color: #01AAED; ???????????color: white; ???????????display:none; ???????????position: fixed; ???????????left: 0%; ???????????top: 0%; ???????} ???????#btn:hover{ ???????????background-color: white; ???????????color: black; ???????} ???</style></head><body><input type="button" value="删除" id="btn"><div style="text-align: center"> ???<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png" ?id="img"></div><script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script><script> ???$(function(){ ???????//此处是针对图片，如果这个元素上鼠标右键，将浏览器默认右键事件给拦截了 ???????$("#img").bind("contextmenu",function(e){ ???????????return false; ???????});- //之前在网上看过很多代码，但是有一个bug，算不少bug，但是我要在这里说一下。鼠标右键点击事件鼠标松开之后 执行的 ，因为个人的操作习惯，当右键点起的时候 在
- 按钮的0*0位置也执行了右键 ，所以说 上边屏蔽了为什么还显示默认浏览器菜单，那么 我们只需要把显示的元素鼠标右键给屏蔽掉就不会了，欢迎大家转载本代码，谢谢大家！
???????$("#btn").bind("contextmenu", function () { ???????????return false; ???????}) ???????$("#img").mousedown(function (e) { ???????????if (e.which == 3) ???????????{ ???????????????//获取鼠标的x轴 ???????????????var x = e.pageX; ???????????????//获取鼠标的Y轴 ???????????????var y = e.pageY; ???????????????//对我们设定的菜单元素位置移动到当前鼠标右键点击的位置，并且显示出来 ???????????????$("#btn").css({ ‘top‘: y + ‘px‘, ‘left‘: x + ‘px‘, ‘display‘: ‘block‘, ‘position‘: ‘absolute‘ }); ???????????} ???????}) ???})</script></body></html>
Html鼠标右键菜单代码
原文地址：http://www.cnblogs.com/cnhonker/p/7667430.html