我有一些代码可以更改表的类。在手机上，有时表格对于屏幕来说太宽了，用户会拖动/滚动查看内容。但是，当他们触摸并拖动表格时，每次拖动都会触发 touchend。
如何测试触摸端是否是由于触摸拖动而出现的？我尝试跟踪 dragstart 和 dragend 但我无法让它工作，这似乎是一种不雅的方法。有什么我可以添加到下面的东西，基本上可以确定，“这个触摸端是在拖动结束时出现的吗？”
$("#resultTable").on("touchend","#resultTable td",function(){
$(this).toggleClass('stay');
});
我提前感谢您的帮助。
PS - 使用最新的 jquery，虽然常规点击有效，但与 touchend 相比非常慢。
首先将一个变量设置为 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
});
touch end 仍然会触发，但会在您的 tap 脚本运行之前自行终止。
为确保您下次触摸时尚未将其设置为已拖动，请在触摸时将其重置为 false。
$("body").on("touchstart", function(){
dragging = false;
});
看起来我的问题的一种解决方案在这里找到：
http://alxgbsn.co.uk/2011/08/16/event-delegation-for-touch-events-in-javascript/
这段代码检测 touchstart 之后的任何移动，以便在 Tapend 之后中止点击行为。
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
我想说当用户拖动以查看更多内容或拖动元素时，您无法区分。我认为你应该改变方法。您可以检测它是否是移动设备，然后绘制一个启用/禁用元素移动的开关。
为了缩短@lededge 的解决方案，这可能会有所帮助。
$("body").on("touchmove", function(){
dragging = true;
}).on("touchend", function(){
if (dragging)
return;
}).on("touchstart", function(){
dragging = false;
});