在事件处理程序内部删除 jQuery 事件处理程序

Question

我有一个keydown事件处理程序，它附加到我的文档上，以便我可以在任何地方观察keydown事件。 但是，在满足某个条件后，我想能够删除那个且仅那个处理程序。我该怎么做？

这是我当前的处理程序：

    $(document).keydown(function(event){
        console.log(event);

        var tag = event.target.tagName.toLowerCase();
        if(event.which = 27 && tag != 'input' && tag != 'textarea'){    //escape has been pressed
            _dismissModal(modal_id);
        }
    });

在调用_dismissModal之后，我想要移除这个keydown事件处理程序。我该如何做到这一点而不是移除所有的keydown事件处理程序？

- Malfist

---

你尝试过使用jQuery的off()方法吗？ - kasper Taeymans

Answer 1

使用.off()方法来移除事件处理程序。

$(document).on("keydown", function(event){
    console.log(event);

    var tag = event.target.tagName.toLowerCase();
    if(event.which = 27 && tag != 'input' && tag != 'textarea'){    //escape has been pressed
        _dismissModal(modal_id);
        $(this).off("keydown");
    }
});

- James Hibbard

---

这会删除所有的 keydown 事件处理程序还是只有我的？ - Malfist

我想要只删除我的。 - Malfist

那么 @kasper Taeymans 已经为您提供了解决方案 - 只需使用命名函数而不是匿名函数即可。 - James Hibbard

Answer 2

你可以使用jQuery off() 方法。你也可以将你的keydown逻辑放入一个单独的函数中，这样你只能在off方法中定位该keydown动作。

var mykeydownfunction= function(){
    console.log(event);

    var tag = event.target.tagName.toLowerCase();
    if(event.which = 27 && tag != 'input' && tag != 'textarea'){    //escape has been pressed
        _dismissModal(modal_id);
        $(this).off('keydown', mykeydownfunction);// $(this) is the document
    }
}  

 $(document).on('keydown', mykeydownfunction);

- kasper Taeymans

Answer 3

这个问题已经有答案了，但是使用命名空间来移除事件确实非常有帮助，并且可以确保不会引起任何副作用。

// add click event with my.namespace as the namespace
$('element').on('click.my.namespace', function (e) {
    // do something
});

// remove my.namespace click event from element
$('element').off('click.my.namespace');

您可以打开开发者控制台，并查看元素的事件。

$._data($('element')[0], 'events');

打开对象，您将看到一个点击数组。展开事件，您将看到命名空间实际上显示为

namespace.my

而不是

my.namespace

http://api.jquery.com/on/

搜索事件名称和命名空间以获取更多信息。

- VtoCorleone

Answer 4

当条件满足时，使用.off()。

$(document).off('keydown');

- Venkata Krishna

---

这会删除所有的 keydown 事件处理程序还是只有我的？ - Malfist

@Malfist - 这将删除所有的 keydown 事件处理程序。 - Venkata Krishna

请看我的回答，只需移除特定的按键动作。@Krishna：不用担心，伙计 :-) - kasper Taeymans

Answer 5

使用 .off() 方法。

 $(document).off('keydown');

- Satpal

---

这会删除所有的 keydown 事件处理程序还是只有我的？ - Malfist

@Malfist，该类型的所有事件（直接和委托）都从jQuery集合中的元素（此处为文档）中删除。 - Satpal

Answer 6

只需将该函数命名以保持代码整洁。

$(document).keydown(function myhandler(e) { // <- see? "myhandler"!
    //do stuff blahblah
    $(document).off("keydown", null, myhandler)
});

附注：没有使用jQuery的同样内容：

document.addEventListener("keydown", function myhandler(event) {
    //blahblahblah do stuff
    document.removeEventListener("keydown", myhandler);
});

- Alex from Jitbit