如何使用jquery/javascript编写自己的右键菜单并禁用默认值
如何使用jquery/javascript编写自己的右键菜单并禁用默认值
提问于 2009-09-20 02:08:51
我使用jquery成功地禁用了页面上的右键单击事件。我想创建一个自定义右击菜单。我该怎么做呢？这是否需要相关的css设置才能运行(即"position")？
回答 2
Stack Overflow用户
发布于 2009-09-20 02:27:24
这个例子是可行的，尽管它很俗气。您可以在上下文菜单处理程序中执行的操作是在屏幕上的特定位置显示带有您选择的项目的DIV。据我所知，在右键单击元素时出现的上下文菜单中没有自定义项目的方法。
<html>
<head>
<title>Context menu test</title>
<style type="text/css">
.element {
background-color: blue;
height: 300px;
width: 300px;
}
.popup {
background-color: red;
border: 1px solid black;
width: 100px;
height: 100px;
position: absolute;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
$(".element").contextmenu
(
function(e) {
$("div.popup").remove();
$("<div class='popup'>Hi</div>").appendTo("body")
.css("left", e.pageX)
.css("top", e.pageY)
.show();
e.preventDefault(); // return false; also works
}
);
}
);
$.fn.contextmenu = function(func) {
return this.bind("contextmenu", func);
}
</script>
</head>
<body>
<div class="element"></div>
</body>
</html>Stack Overflow用户
发布于 2012-05-23 06:02:59
还有一个插件：Audero Context Menu。它是免费的，并且使用起来非常简单。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1450100
复制相关文章
相似问题
腾讯云开发者
