javascript - How to fire method only once when using panright with Hammer.js? - Stack Overflow

admin管理员组

文章数量:1345011

I am running into issues with getting Hammer.js (with the jQuery plugin) to function properly when using swiperight. Therefore, I need to use panright.

When panning to the right, my event fires many, many times.

How can this be updated so it only runs once? (then again when the user swipes to the right or left on another slide)

$('.slide').hammer().on('panright', doSomething);

I am running into issues with getting Hammer.js (with the jQuery plugin) to function properly when using swiperight. Therefore, I need to use panright.

When panning to the right, my event fires many, many times.

How can this be updated so it only runs once? (then again when the user swipes to the right or left on another slide)

$('.slide').hammer().on('panright', doSomething);

• javascript
• jquery
• ios
• dom-events
• hammer.js

Share Improve this question Follow edited Nov 9, 2019 at 18:37 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Jan 7, 2015 at 3:53 CofeyCofey 11.4k1616 gold badges5454 silver badges7575 bronze badges 1

• FWIW, I found I was getting multiple Hammer events firing because I'd inadvertently installed multiple handlers for the same event. Worth checking that your control flow's not doing the same. – Velojet Commented Jan 18, 2019 at 22:45

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 9

I think you should capture a panend event. For example:

var myElement = document.getElementById('myID');
var mc = new Hammer.Manager(myElement);
mc.add(new Hammer.Pan({direction:Hammer.DIRECTION_HORIZONTAL, threshold:80, pointers: 0}));
mc.on("panend", function(ev) {
  if(ev.direction == Hammer.DIRECTION_RIGHT) 
  {
    //do what you want here
  }
});

You can filter the event by isFinal property:

var mc = new Hammer($('.screen'));
mc.on("swipeleft", moveHandler);
mc.on("swiperight", moveHandler);

function moveHandler(event){
  if(event.isFinal){
  // do something on the last animation frame
  }
}

There are other events called 'swipeleft' and 'swiperight'. This will respond to 1 swipe event instead of pan's multiple fired events.

var mc = new Hammer($('.screen'));
mc.on("swipeleft", moveHandler);
mc.on("swiperight", moveHandler);

function moveHandler(event){
    // do something
}

Documentation

本文标签： javascriptHow to fire method only once when using panright with HammerjsStack Overflow