如何在一般HTML元素上获得触摸事件（Hammer）？(How do I get touch events (Hammer) on general HTML elements?)

如何在一般HTML元素上获得触摸事件（Hammer）？(How do I get touch events (Hammer) on general HTML elements?)

我在滑动菜单/导航器的页面元素中有一个DIV。 我正在尝试捕获此元素上的Hammer事件，但我只能访问“触摸”事件。

var hammer = Hammer(getElementById('myDiv')); hammer.on('touch swipe', function(e){ console.log(e); });

有没有我缺少的东西，或Onsen UI是否设置了Hammer干扰的特定事物？

I have a DIV inside a page element of a sliding menu / navigator. I'm trying to capture Hammer events on this element but am only able to access "touch" events.

var hammer = Hammer(getElementById('myDiv')); hammer.on('touch swipe', function(e){ console.log(e); });

Is there something I'm missing, or does Onsen UI set specific things with Hammer that is interfering?

最满意答案

您是否取消了默认触摸事件？ 它对我有用。

var element = document.querySelector('.your-div'); element.ontouchmove = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; element.ontouchstart = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; element.ontouchend = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; var hammertime = Hammer(element).on("swiperight", function(event) { //do stuff });

Did you cancel default touch event? It worked for me.

var element = document.querySelector('.your-div'); element.ontouchmove = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; element.ontouchstart = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; element.ontouchend = function(event) { if (!event.elementIsEnabled) { event.preventDefault(); } }; var hammertime = Hammer(element).on("swiperight", function(event) { //do stuff });