Hammer.js event delegation using jQuery

Question

I started using Hammer.js ( https://github.com/eightmedia/hammer.js ), which is a very small script, but I'm not sure how to delegate events using the jQuery.on () event handler.

I created a small jsfiddle example here: 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++; }); 

Answer 1

I don’t know, have you ever found an answer to your question. The solution is simple and consists of two parts. First, since you are trying to use calls with jQuery, you must use the jQuery version for the Hammer plugin. The current version of the jQuery plugin can be found at:

http://eightmedia.imtqy.com/hammer.js/dist/jquery.hammer.min.js

The second part - you need to use the Hammer method with object selection. You do this by inserting a Hammer call between the selector and the binding. For instance:

JQuery object:

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

JQuery Hammer Object:

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

What is it...