我如何在 Hammer.js 中使用纯 JavaScript 执行 jQuery 样式的事件委托(delegate)？例如:
Hammer(document).on('tap', '.item', function () {
console.log('tapped')
})
这是直接可行的还是我必须自己进行授权？
最佳答案
受 Jools 回答的启发，这就是我的想法。我没有考虑纯 JS 解决方案——事实上，这是为与 Backbone.View 一起使用而设计的，但很容易适应其他情况。
当它到达 View 的根元素(this.el)时，它将停止攀登节点树。从 HammerJS 事件标识的目标开始，它将寻找与指定选择器匹配的第一个元素，如果没有找到该元素，则返回 undefined。
要在非 Backbone 环境中使用，只需将对限制/包含元素的引用作为第三个参数传递(如在 Jools 的解决方案中)并使用它来替换 this.el。
/**
* @param {Node}target - the target of the received event
* @param {String}selector - any jQuery-compatible selector
*/
getEventDelegate: function (target, selector) {
var delegate;
while (target && target != this.el) {
delegate = $(target).filter(selector)[0];
if (delegate) {
return delegate;
}
target = target.parentNode;
}
return undefined;
}
如果你有一个 onTap 回调函数，它可能看起来像这样:
/**
* @param {Event}ev
*/
onTap: function (ev) {
var target = this.getEventDelegate(ev.target, "#desiredTarget");
if (target) {
// TODO something with the target...
}
}
要将它们全部连接起来，您需要这样的东西...
this._hammer = new Hammer(this.el);
this._hammer.on('tap', _.bind(this.onTap, this));
(不要忘记在 View 被销毁时调用 this._hammer.destroy()!)
关于javascript - 使用 Hammer.js 的事件委托(delegate)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17879906/