1

I have the following JS for a doubletap event on the element '.snap_img' with the Hammer.js JQuery plugin.

$("body").hammer().on('doubletap','.snap_img',function() {
    img_src = (this).getAttribute('src');
    alert(img_src);
    return false;
});

The element '.snap_img' is created dynamically by an AJAX post() request. Therefore, I need event delegation to be able to fire the Hammer event. This JS is based on this piece of code which successfully fires a click event on the dynamically loaded .snap_img elements:

$("body").on('click','.snap_img',function() {
    img_src = (this).getAttribute('src');
    alert(img_src);
    return false;
});

How do I make the code with the Hammer JQuery plugin work? I suppose the solution should be very similar to the second piece of code in this question, but I can't seem to figure it out.

erol_smsr
  • 1,454
  • 4
  • 24
  • 49

1 Answers1

0

If you are using Hammer, you can try something like this:

var i = 0
$('.snap_img').get(0).hammer().on('doubletap', function(e) {
  i++
  console.log( 'double tap' + i )
})
ltlBeBoy
  • 1,242
  • 16
  • 23
Kamil
  • 1,633
  • 2
  • 21
  • 24
  • When using jQuery to identify the element, the Hammer.JS jQuery plugin style has to be used. So it's either `$('.snap_img').get(0).hammer().on(...);` for jQuery plugin or `Hammer(document.getElementsByClassName('.snap_img')[0]).on(...);` for non jQuery. Otherwise an error will occur. See [hammer.js object has no method addEventListener](https://stackoverflow.com/q/28191732/5223047) – ltlBeBoy Jun 30 '17 at 09:04