Question

我试图允许在父元素上滑动并单击子元素。目前，当我只想要滑动时，滑动和点击就会触发。

HTML

<div id="slider">
  <div class="broadcast__message__list__item">Try and swipe me</li>
</div>

JS

var slider = document.getElementById("slider");
Hammer(slider).on("swipeleft", function() {
  console.log("swipe left");
});
Hammer(slider).on("swiperight", function() {
  console.log("swipe right");
});

$(document).on("click", ".broadcast__message__list__item", function(e) {
  console.log("click");
});

CODEPEN

Answer 1

我找到了解决问题的方法，但它很黑，我无法在实践中使用它。

var slider = document.getElementById("slider");
var lastSwipe = 0;
Hammer(slider).on("swipeleft", function() {
  lastSwipe = new Date().getTime();
  console.log("swipe left");
});
Hammer(slider).on("swiperight", function() {
  lastSwipe = new Date().getTime();
  console.log("swipe right");
});

$(document).on("click", ".broadcast__message__list__item", function(e) {
  var t = new Date().getTime() - lastSwipe;
  if(t > 100) {
    console.log(t + " click");
  }
});

滑动并单击同时触发的事件 - Hammer.js

1 个答案: