Javascript Hammer.js can';无法删除事件侦听器

Javascript Hammer.js can';无法删除事件侦听器,javascript,hammer.js,Javascript,Hammer.js,我创建了一个hammer实例,如下所示: var el = document.getElementById("el"); var hammertime = Hammer(el); 然后,我可以添加一个侦听器: hammertime.on("touch", function(e) { console.log(e.gesture); } 但是,我无法删除此侦听器,因为以下内容不起任何作用: hammertime.off("touch"); 我做错了什么?我如何摆脱一个锤子听众?目前,h

我创建了一个hammer实例,如下所示:

var el = document.getElementById("el");
var hammertime = Hammer(el);
然后,我可以添加一个侦听器:

hammertime.on("touch", function(e) {
    console.log(e.gesture);
}
但是,我无法删除此侦听器,因为以下内容不起任何作用:

hammertime.off("touch");
我做错了什么?我如何摆脱一个锤子听众?目前,hammer.js文档非常糟糕,因此除了存在
.on()
.off()
方法之外,它什么也解释不了。我不能使用jQuery版本,因为这是一个性能关键的应用程序


JSFiddle来展示这一点:

好的,我想出来了。来源很简单,它正在做:

on: function(t, e) {
    for (var n = t.split(" "), i = 0; n.length > i; i++)
        this.element.addEventListener(n[i], e, !1);
    return this
},off: function(t, e) {
    for (var n = t.split(" "), i = 0; n.length > i; i++)
        this.element.removeEventListener(n[i], e, !1);
    return this
}
这里需要注意的是(除了一个糟糕的文档),它是
e
事件中
on
事件中的回调函数,因此您正在执行以下操作:

this.element.addEventListener("touch", function() {
    //your function
}, !1);
但是,在remove中,您不会传递回调,因此您会:

this.element.removeEventListener("touch", undefined, !1);
因此,浏览器不知道您是否尝试解除绑定,您可以不使用匿名函数修复此问题,就像我在中所做的那样:


有关更多信息:

HammerJS 2.0现在支持取消绑定事件的所有处理程序:

function(events, handler) {
    var handlers = this.handlers;
    each(splitStr(events), function(event) {
        if (!handler) {
            delete handlers[event];
        } else {
            handlers[event].splice(inArray(handlers[event], handler), 1);
        }
    });
    return this;
}
这是一个什么样的例子。我为“tap”事件创建了一个简单的包装器(尽管它可以很容易地适应其他任何事情),以跟踪每个Hammer管理器。我还创建了一个kill函数来无痛地停止监听:P

var TapListener = function(callbk, el, name) {
    // Ensure that "new" keyword is Used
    if( !(this instanceof TapListener) ) {
        return new TapListener(callbk, el, name);
    }
    this.callback = callbk;
    this.elem = el;
    this.name = name;
    this.manager = new Hammer( el );
    this.manager.on("tap", function(ev) {
            callbk(ev, name);
    });
}; // TapListener
TapListener.prototype.kill = function () {
    this.manager.off( "tap", this.callback );
};
所以你基本上会这样做:

var myEl = document.getElementById("foo"),
    myListener = new TapListener(function() { do stuff }, myEl, "fooName");
    // And to Kill
    myListener.kill();

要在关闭时解除事件绑定,必须:

1) 作为参数传递,以关闭在启用时设置的同一回调函数

2) 使用用于设置ON事件的相同Hammer实例

例如:

var mc = new Hammer.Manager(element);
mc.add(new Hammer.Pan({ threshold: 0, pointers: 0 }));
mc.add(new Hammer.Tap());
var functionEvent = function(ev) {
    ev.preventDefault();
    // .. do something here
    return false;
};
var eventString = 'panstart tap';
mc.on(eventString, functionEvent);
解除绑定事件:

mc.off(eventString, functionEvent);

我认为这应该行得通……出于好奇,您是否尝试过重新创建该实例?像
Hammer(el.off(“touch”)
@NicoSantangelo-Yep,它什么也不做。监听器仍然在那里。@NicoSantangelo还添加了一个显示行为的小提琴,可以很容易地测试出来。谢谢,我想这是有道理的,我忘了没有它,
removeEventListener()
会失败。如果hammer.js能够添加一些向导来实现这一点,比如在数组中存储对匿名函数的引用,那就太好了。我会向他们建议。是的,他们可能会解决这个问题,让用户看不到它,但至少在文档中提到一点是很重要的:取消时,您必须使用您通过调用来设置/启用事件的同一个Hammer实例。您是否希望存储对Hammer实例的引用(即
mc
)如果
off
发生在代码的其他部分?