Question

我想为页面的整个主体添加自定义上下文菜单和jQuery，但文本字段除外。我怎样才能做到这一点？我试过那段代码：

$('body:not(input)').bind('contextmenu', function(){
    /*code*/
});

Answer 1

在插件执行前检查srcElement。如果它不是输入元素，请触发contextmenu插件：

$(document).on("contextmenu", function(e) {
    if (!$(e.srcElement).is(":input")) { // if it's not an input element...
        $(this).triggerTheContextMenuPlugin();
    }
});

Answer 2

在document上使用事件监听器，并检查它是否由输入元素启动。

$(document).on("contextmenu", function (e) {
    if (e.target.tagName.toUpperCase() === "INPUT") {
        console.log("context menu triggered");
    }
});

Demo here

Answer 3

受到Salman解决方案的启发。

您可以使用e.stopPropagation()功能在所有输入元素中停止事件传播。这样，您可以保留inputs元素的默认行为：

$(function() {
    $(document).on("contextmenu", function(e) {
        alert("Context menu triggered, preventing default");
        e.preventDefault();
    });
    $("input").on("contextmenu", function(e) {
        e.stopPropagation();
    });
});

JSFiddle Demo

自定义上下文菜单除了jQuery中的“输入”之外的所有内容

3 个答案: