javascript - 检查 touchend 是否在拖动之后出现

Question

我有一些代码可以更改表的类。在手机上，有时表格对于屏幕来说太宽了，用户会拖动/滚动来查看内容。但是，当他们触摸并拖动表格时，它会在每次拖动时触发 touchend。

如何测试触摸端是否是触摸拖动的结果？我尝试跟踪 dragstart 和 dragend 但我无法让它工作，这似乎是一种不优雅的方法。有什么我可以添加到下面的东西，它基本上可以确定，“这个 touchend 是在拖动结束时出现的吗？”

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

在此先感谢您的帮助。

PS - 使用最新的 jquery，虽然可以正常点击，但与 touchend 相比非常慢。

Answer 1

使用两个监听器:

首先设置一个变量为false:

var dragging = false;

然后ontouchmove设置dragging为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;
});