检查touchend是否在拖动之后

我有一些代码，它改变了表的类。 在手机上，有时桌子太宽了，用户会拖动/滚动查看内容。 但是，当他们触摸并拖动表格时，会触发每次拖动的触发。

我如何testing，看是否触摸拖动的结果？ 我尝试跟踪dragstart和dragend，但我无法得到这个工作，这似乎是一个不雅的方法。 有什么我可以添加到下面，基本上确定，“这个touchend到达拖动结束？

$("#resultTable").on("touchend","#resultTable td",function(){ $(this).toggleClass('stay'); }); 

在此先感谢您的帮助。

PS – 使用最新的jQuery，虽然经常点击的作品，但与touchend相比非常缓慢。

Answer 1

使用两个监听器：

首先设置一个variables为false：

 var dragging = false; 

然后ontouchmove设置拖动到true

 $("body").on("touchmove", function(){ dragging = true; }); 

然后在拖动完成后，检查拖动是否为真，如果是这样，则将其视为拖动的触摸：

 $("body").on("touchend", function(){ if (dragging) return; // wasn't a drag, just a tap // more code here }); 

触摸结束仍然会触发，但会在您的轻敲脚本运行之前自行终止。

为了确保您下次触摸时尚未将其设置为拖动状态，请在触摸时将其重置为false。

 $("body").on("touchstart", function(){ dragging = false; }); 

Answer 2

看起来像我的问题的解决scheme是在这里find：

http://alxgbsn.co.uk/2011/08/16/event-delegation-for-touch-events-in-javascript/

这段代码检测touchstart之后的任何移动，以便在带子之后中止抽头行为。

 var tapArea, moved, startX, startY; tapArea = document.querySelector('#list'); //element to delegate moved = false; //flags if the finger has moved startX = 0; //starting x coordinate startY = 0; //starting y coordinate //touchstart tapArea.ontouchstart = function(e) { moved = false; startX = e.touches[0].clientX; startY = e.touches[0].clientY; }; //touchmove tapArea.ontouchmove = function(e) { //if finger moves more than 10px flag to cancel //code.google.com/mobile/articles/fast_buttons.html if (Math.abs(e.touches[0].clientX - startX) > 10 || Math.abs(e.touches[0].clientY - startY) > 10) { moved = true; } }; //touchend tapArea.ontouchend = function(e) { e.preventDefault(); //get element from touch point var element = e.changedTouches[0].target; //if the element is a text node, get its parent. if (element.nodeType === 3) { element = element.parentNode; } if (!moved) { //check for the element type you want to capture if (element.tagName.toLowerCase() === 'label') { alert('tap'); } } }; //don't forget about touchcancel! tapArea.ontouchcancel = function(e) { //reset variables moved = false; startX = 0; startY = 0; }; 

更多在这里： https ： //developers.google.com/mobile/articles/fast_buttons

Answer 3

我会说，当用户拖动看到更多的内容或拖动元素周围时，你不能区分差异。 我想你应该改变方法。 你可以检测它是否是一个移动设备，然后绘制一个开关来启用/禁用元素的移动。