javascript - 检测用户的 Intent 是点击还是在触觉设备上向上/向下滚动页面

Question

如果用户在 popup-div 之外点击 (touchstart)，我想隐藏弹出窗口。

但如果用户的 Intent 是滚动/滑动 (touchmove)，我不想隐藏弹出窗口。

代码如何检测和响应这两个操作(使用或不使用 jQuery)？

Answer 1

这是一个基本示例，说明如何执行此操作: http://jsfiddle.net/4CrES/2/

其背后的逻辑涉及检测初始触摸时间并将其保存到var

touchTime = new Date();

在 touchend 处理程序中从当前时间中减去这个时间以获得差异:

var diff = new Date() - touchTime;

使用 if 语句来确定触摸持续时间是否足够短以将其视为点击，或是否足够长以将其视为拖动。

if (diff < 100){
    //It's a tap
}
else {
    //Not a quick tap
}

您可以通过处理程序中初始触摸 y 位置与最终触摸 y 位置的类似差异来编写更健壮的实现。另一种选择是比较滚动区域的scrollTop是否已经滚动。