我使用以下代码片段来构建自定义上下文菜单：
<script type="text/javascript">
$(document).ready(function() {
var x, y;
document.oncontextmenu = function(e) {
e.preventDefault();
x = e.clientX;
y = e.clientY;
$("#rkm").css("left", x + "px");
$("#rkm").css("top", y + "px");
$("#rkm").show();
};
$(document).mousedown(function(e) {
if (!(e.clientX >= x && e.clientX <= (x + $("#rkm").width()) && e.clientY >= y && e.clientY <= (y + $("#rkm").height()))) {
$('#rkm').hide();
}
});
$(window).scroll(function () {
$('#rkm').hide();
});
});
</script>
我在 HTML 中有以下标记：
我在一个页面上有很多 div 框，每个框都“回显”（PHP）一些内容，除此之外a标签，包含特定链接（带有 ID）。
现在的问题是：我能以某种方式找出右键单击打开上下文菜单的 div 发生的情况吗？因为我想在我的上下文菜单中有一个链接，其中包含一个 php 文件，必须通过传递提到的 ID（来自a tag).
我希望任何人都可以帮助我。
如果有任何疑问，请随时提问。
这是一个小提琴示例：https://jsfiddle.net/0em8wu2a/ https://jsfiddle.net/0em8wu2a/
Edit:编辑了小提琴，可达here https://jsfiddle.net/0em8wu2a/1/。添加了一个 jquery 命令来查找下一个 a 标签。但在我的服务器上，它根本不起作用（返回“#”），并且在小提琴上，它总是返回第一个 div 的 url...
e.target为您提供发生点击的 DOM 对象。e.target.tagName可以给你标签名称。
$(document).ready(function () {
var x, y;
document.oncontextmenu = function (e) {
e.preventDefault();
x = e.clientX;
y = e.clientY;
if($(e.target).is('div'))
var targetDiv = $(e.target).find('a');
else
var targetDiv = $(e.target).closest('div').find('a');
if( targetDiv !== undefined ){
var linkVal = window.location.protocol + "//" + window.location.host + "/" + targetDiv.attr('href');
var link = $('<a>')
.attr('href',linkVal)
.text(linkVal);
console.log(link);
$("#rkm").empty()
.append(link)
.css({
"left": x + "px",
"top": y + "px"
})
.show();
}
};
$(document).mousedown(function (e) {
if (!(e.clientX >= x && e.clientX <= (x + $("#rkm").width()) && e.clientY >= y && e.clientY <= (y + $("#rkm").height()))) {
$('#rkm').hide();
}
});
$(window).scroll(function () {
$('#rkm').hide();
});
});
div#rkm {
position: fixed;
display: none;
z-index: 1000;
background-color:black;
}
div#rkm a {
display: block;
margin: 2px;
font-size:23px;
color:white;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div> <a href="test.php?id=1">div1</a>
<p>....
<br/>......
<br/>
</p>
</div>
<br/>
<br/>
<hr/>
<div> <a href="test.php?id=2">div2</a>
<p>....
<br/>......
<br/>
</p>
</div>
<div id="rkm"> <a href="#">Menüeintrag</a>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
