javascript - 纯 Javascript 取消绑定文档事件

Question

我对事件侦听器和解除绑定有困难。我有以下代码：

function delegate(el, evt, sel, handler) {
    el.addEventListener(evt, function(event) {
        var t = event.target;
        while (t && t !== this) {
            if (t.matches(sel)) {
                handler.call(t, event);
            }
            t = t.parentNode;
        }
    });
}

我应用这样的功能：

function captureMouseDown() {
    console.log('mouse downed');
}

delegate(document, 'mousedown', '.js-flex', captureMouseDown);

如何取消对文档和/或选择器 js-flex 的事件的委托

标签： javascriptdelegatesdom-events

Answer 1

一种选择是delegate返回传递给的函数addEventListener，然后你可以removeEventListener用它调用：

function delegate(el, evt, sel, handler) {
    const listener = function(event) {
        var t = event.target;
        while (t && t !== this) {
            if (t.matches(sel)) {
                handler.call(t, event);
            }
            t = t.parentNode;
        }
    };
    el.addEventListener(evt, listener);
    return listener;
}

const listener = delegate(document, 'mousedown', '.js-flex', captureMouseDown);
// ...
document.removeEventListener('mousedown', listener);