Question

我正在使用hammer.js 2.0

我有一个容器，需要刷卡事件。但是，该容器有一个旋转木马元素，它包含自己的滑动通风口。如何在但旋转木马？

的任何地方触发此滑动事件？

var self = this,
    hammerContainer = document.querySelector('section.content-wrapper'),
    carousel = document.querySelector('.image-gallery-carousel'),
    hammerOpts = {
      threshold: 4,
      velocity: .3
    },
    hammer = new Hammer(hammerContainer, hammerOpts);

Hammer.off(carousel, 'swipeleft swiperight', function () {
});

hammer.on('swipeleft', function (e) {
// do some other things
});

.off方法似乎不适用于我的轮播。锤子事件仍在propag传播？ ¿鼓泡？

它不需要点击只是旋转木马，而是它可能拥有的任何孩子。

Answer 1

我发现工作的唯一方法是让jQuery参与其中。我觉得自己不是一个更好的人。

抓住event.target
使用jQuery的.parents()方法获取所有目标的父级，这些父级将具有给定的类名
使用if语句检查父母的长度，如果长度为0，请执行我的滑动

使用属性选择器检查单词carousel的所有实例和变体作为类名，例如：[class*="carousel"]

var self = this,
  hammerContainer = document.querySelector('section.content-wrapper'),
  hammerOpts = {
    threshold: 4,
    velocity: .3
  },
  hammer = new Hammer(hammerContainer, hammerOpts);

  hammer.on('swiperight', function (e) {
    if (!$(e.target).parents('[class*="carousel"]').length) {
     //do swipey things   
    }
  });

我觉得事件传播应该是我能做的事情。比如，调用e.stopPropagation()。

有人，任何人，请告诉我一个更好的方法。

如何在父元素上使用hammer.js滑动事件，而不是普通的子元素？

1 个答案: