Question

我目前正在使用附加到$（文件）的活动我尝试将其更改为页面上的不同元素，但没有任何反应。

这是我的基本上下文菜单的起始代码

    $(document).bind("contextmenu", function (event) {
        event.preventDefault();
        if ($(".context-menu") != null) {
            $(".context-menu").remove();
        }
        $("<div class='context-menu'>" +
            "<ul>" +
            "<a href=javascript:null onclick=''><li>Do Something</li></a>" +
            "</ul>"+
            "</div>")
            .appendTo("body")
            .css({ top: event.pageY + "px", left: event.pageX + "px" });
    });
    $(document).bind("click", function (event) {
        $(".context-menu").remove();
    });

澄清

我不是要创建一个上下文菜单。我正在尝试创建多个，每个都是通过右键单击其他元素来触发的。

例如，如果右键单击div，则会获得一个上下文菜单，可以更改div的颜色，如果右键单击文档，则会获得不同的上下文菜单，如果右键单击标题，但不同的上下文菜单。

可以这样做吗？

这是我无效的尝试

    $(document).bind("contextmenu", function (event) {
        event.preventDefault();

    });
    $(document).bind("click", function (event) {
        $(".context-menu").remove();
    });

    $("#divID").mousedown(function (e) {
            if (e.button == 2) {
                if ($(".context-menu") != null) {
                    $(".context-menu").remove();
                }
                $("<div class='context-menu'>" +
                    "<ul>" +
                    "<a href=javascript:null onclick=''><li>Do Somthing</li></a>" +
                    "</ul>" +
                    "</div>")
                    .appendTo("divID")
                    .css({ top: event.pageY + "px", left: event.pageX + "px" });
                return false;
            }
            return true;
        });

Answer 1

我的小提琴可能会帮助你!!!

Just Sample code

$(document).bind("contextmenu", function (event) {
     event.preventDefault();
});

$(document).on("mousedown","#divID",function (e) {
    if ($(".context-menu").length != 0) {
        $(".context-menu").remove();
    }
    if (e.button == 2) {
        event.preventDefault();

        $("<div class='context-menu'>" +
             "<ul>" +
             "<a href=javascript:null onclick=''><li>Do Somthing</li></a>" +
             "</ul>" +
              "</div>")
        .appendTo($(this))
             .css({ top: event.pageY + "px", left: event.pageX + "px" });
        return false;
    }
    return true;
});

Jquery on

绑定事件父级，但定位子级

Answer 2

如果没有为您编写完整的脚本，您希望获得

e.target.tagName或event.srcElement.tagName（取决于浏览器）

来自事件监听器的

。

这将为您提供A，IMG，TEXTAREA等。

如何根据单击的对象在右键单击创建多个上下文菜单？

2 个答案: