javascript 暂时禁用所有当前活动的 jQuery 事件处理程序

Temporarily disable all currently active jQuery event handlers

提问by warvariuc

I am making a TDelement of table editable on double click:

我正在TD双击可编辑表格元素：

$(document).on("dblclick", "#table>tbody>tr>td.cell", function(e) {
    if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey)
        // need left button without keyboard modifiers
        return;
    reset_selection();
    var editor = document.createElement("div");
    editor.setAttribute("contenteditable", "true");
    editor.innerHTML = this.innerHTML;
    this.innerHTML = '';
    // this.style.padding = 0;
    this.appendChild(editor);
    $(document).on("*", stub);
    editor.onblur = function() {
        // this.parentNode.setAttribute("style", "");
        this.parentNode.innerHTML = this.innerHTML;
        sys.editor = null;
        $(document).off("*", stub);;
    };
    editor.focus();
});

function stub(e) {
    e.stopImmediatePropagation();
    return false;
}

But when i double click on the text inside the editable div, the double click event propagates to the parent td causing undesired consequences. There are also other events (select, mousedown, etc) i want to prevent, so writing a stub for each of them doesn't look nice to me.

但是，当我双击可编辑 div 内的文本时，双击事件会传播到父 td，从而导致不良后果。我还想阻止其他事件（select、mousedown等），因此为每个事件编写存根对我来说并不好看。

Is there a way to disable all currently active jQuery event handlers and enable them afterwards? Or somewhow stop propagating all events from the editable div to its parents?

有没有办法禁用所有当前活动的 jQuery 事件处理程序并在之后启用它们？或者以某种方式停止将所有事件从可编辑 div 传播到其父级？

回答by T.J. Crowder

Or somewhow stop propagating all events from the editable div to its parents?

或者以某种方式停止将所有事件从可编辑 div 传播到其父级？

It may not be very palatable, but it's not thatbad to specifically disable the events:

它可能不是很可口，但专门禁用事件并没有那么糟糕：

$(this).on("select mousedown mouseup dblclick etc", false);

(Assuming thisrefers to the cell you're editing.)

（假设this指的是您正在编辑的单元格。）

There is a limited number of events, after all, and onallows you to list them in a space-delimited string and disable them by passing false.

毕竟，事件数量有限，并且on允许您在以空格分隔的字符串中列出它们并通过传递false.

You can then re-enable them by passing the same list and falseagain into off.

然后，您可以通过将相同的列表false再次传递到off.

回答by sdespont

Use on / off JQuery methods :

使用开/关 JQuery 方法：

var myFunction = function(e) {
        if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey)
            // need left button without keyboard modifiers
            return;
        reset_selection();
        var editor = document.createElement("div");
        editor.setAttribute("contenteditable", "true");
        editor.innerHTML = this.innerHTML;
        this.innerHTML = '';
        // this.style.padding = 0;
        this.appendChild(editor);
        $(document).on("*", stub);
        editor.onblur = function() {
            // this.parentNode.setAttribute("style", "");
            this.parentNode.innerHTML = this.innerHTML;
            sys.editor = null;
            $(document).off("*", stub);;
        };
        editor.focus();
};

function stub(e) {
    e.stopImmediatePropagation();
    return false;
}

//Active the events
$(document).on("dblclick", "#table>tbody>tr>td.cell", myFunction);

//Disable the events
$(document).off("dblclick", "#table>tbody>tr>td.cell",myFunction);

//Reactive the events
$(document).on("dblclick", "#table>tbody>tr>td.cell", myFunction);

Update

更新

You can also manage a variable set to trueif the event must not be taking into account :

您还可以管理一个变量设置为true如果事件必须不考虑：

var skipEvent = true;

$(document).on("dblclick", "#table>tbody>tr>td.cell", function (e) {
    //Check variable and skip if true
    if (skipEvent) 
        return false;

    if (e.which != 1 || e.shiftKey || e.altKey || e.ctrlKey)
    // need left button without keyboard modifiers
    return;
    reset_selection();
    var editor = document.createElement("div");
    editor.setAttribute("contenteditable", "true");
    editor.innerHTML = this.innerHTML;
    this.innerHTML = '';
    // this.style.padding = 0;
    this.appendChild(editor);
    $(document).on("*", stub);
    editor.onblur = function () {
        // this.parentNode.setAttribute("style", "");
        this.parentNode.innerHTML = this.innerHTML;
        sys.editor = null;
        $(document).off("*", stub);;
    };
    editor.focus();
});