使用 jQuery 委托 Hammer.js 事件答案

【问题标题】：Delegating Hammer.js events with jQuery使用 jQuery 委托 Hammer.js 事件
【发布时间】：2012-04-17 12:50:33
【问题描述】：

我已经开始使用 Hammer.js (https://github.com/eightmedia/hammer.js)，这是一个很棒的小脚本，但我不确定如何使用 jQuery 的 .on() 事件处理程序委托事件。

我在这里设置了一个小 jsfiddle 示例：http://jsfiddle.net/will/3dUKu/1/

var i = 0;
// How would I apply hammer to this situation?
$('nav').on('click', 'button', function() {
    $('<button id="' + i + '">Extra button ' + i + ' (' + $(this).attr('id') + ')</button>').appendTo('nav');
    i++;
});

【问题讨论】：

标签： jquery events touch hammer.js

【解决方案1】：

不知道您是否找到了问题的答案。解决方案很简单，分为两部分。首先，由于您尝试使用 jQuery 调用，您应该使用 Hammer 的 jQuery 插件版本。可以在以下位置找到 jQuery 插件的当前版本：

http://eightmedia.github.io/hammer.js/dist/jquery.hammer.min.js

第二部分是你需要使用 Hammer 的方法来选择对象。为此，您可以在选择器和绑定之间插入 Hammer 调用。像这样：

jQuery 对象：

$('nav').on('click', 'button', function(){ 
    /* ... */ 
});

jQuery Hammer 对象：

$('nav').hammer().on('click', 'button', function(){
    /* ... */
});

就是这样……

【讨论】：

这对我来说不适用于最新的hammerjs .. $('.parent').hammer().on('tap', '.child', function() { console.log ('点击'); });
所有jQ 插件都会实例化一个Hammer 实例并将其附加到元素上。看起来它实际上对事件委托毫无帮助。