Question

在我的上一个问题中，我想出了如何显示我自己的上下文菜单，其中包含链接，具体取决于您点击的div（有关详细信息，请参阅here）。

现在我遇到了问题，我没有想法，我怎么能阻止，在我想要显示上下文菜单的上方，上下文菜单没有显示。为了解决我的问题， heres a fiddle.

所以在顶部区域，我不想在div框中显示上下文菜单（看起来像这样：

    <div class="altContext">
    <a href="test.php?id=1">div1</a>
    <p>....<br/>......<br/></p>
</div>

），我想显示我的自定义上下文菜单。

问题是，如果我没有点击一个div，那么这个＆＃34; altContext＆＃34;找到下一个最近的div。这是必要的，因为否则，当我右键单击时，某些div不起作用。我使用该代码执行此操作：

if($(e.target).is('div'))
            var targetDiv = $(e.target).find('a');
        else
            var targetDiv = $(e.target).closest('div').find('a');

但是这会引发问题，在顶部区域，其中的div用于右键单击。

是否有任何妥协，同时拥有两个：每个div的单独上下文菜单，类＆＃34; altContext＆＃34;以及上面的内容，根本没有显示上下文菜单..？

Answer 1

<强> DEMO

在您提供的代码if(targetDiv != undefined)中，var targetDiv = $(e.target).closest('div.altContext').find('a')未返回undefined。所以我们需要检查对象的长度。同时添加div.altContext作为元素检查更准确。

if($(e.target).is('div.altContext'))
    var targetDiv = $(e.target).find('a');
else
    var targetDiv = $(e.target).closest('div.altContext').find('a');
if( targetDiv.length != 0 ){
    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();
}

上下文菜单，隐藏在某些区域

1 个答案: