javascript - 如何在父元素上触发 Hammer.js 滑动事件，但在一般子元素上不触发？

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 方法似乎不适用于我的轮播。锤子事件仍在“传播”？ ??冒泡？

它不需要只在传送带上触发，但也可以在它可能有的任何子项上触发。

Answer 1

我发现唯一可行的方法就是让 jQuery 参与进来。我不觉得自己是一个更好的人。

1. 抓取event.target
2. 使用 jQuery 的 .parents() 方法来获取属于给定类名的所有目标的父级
3. 使用 if 语句检查这些父级的长度，如果长度为 0，则执行我的滑动

4. 使用属性选择器检查单词 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()。

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