触摸事件：处理滑动与点击不同？答案

【问题标题】：Touch events: handle swipe differently from click?触摸事件：处理滑动与点击不同？
【发布时间】：2014-02-06 18:05:08
【问题描述】：

我有一个 Backbone 应用程序，我正在使用 Modernizr。

在触摸设备上，我无法滑动页面来向下滚动，因为触摸事件正在触发 Backbone 侦听器和一系列复杂事件，而不是通常的页面滚动。

这是我的代码：

 events: function () {
  if (this.modernizr.touch) {
    return {
      'touchstart .hover': 'onTouchStart'
    };
  } else {
    return {
      'mousemove .hover': 'onMouseMove'
    };
  }
}
// onTouchStart and onMouseMove both fire a listener

我应该使用什么事件来区分滑动和点击，以便滑动允许用户正常移动页面？（我不能轻易地在触控设备上进行测试，所以你知道这不是一个懒惰的问题。）

【问题讨论】：

标签： javascript jquery backbone.js touch modernizr

【解决方案1】：

您的onTouchStart 函数是否调用event.preventDefault()？如果是这样，那将停止触发本机滑动滚动行为的事件。删除该调用应该允许用户正常滚动。

This HTML5 Rocks article 详细介绍了触摸事件如何传播/级联。

旁注：你在这里使用的模式做了一些危险的假设 IMO：

如果Modernizr.touch 是false，则仅绑定鼠标事件，使用混合设备（支持触控的笔记本电脑等）的用户将无法使用鼠标/触控板；为什么不直接绑定这两个事件？
某些浏览器/设备无法触发touchstart 或 mousemove（键盘用户、Windows 智能手机等），因此无法使用此功能；如果你绑定到click 事件也作为后备，你会覆盖它们

我最近 wrote an article 谈到了我认为涵盖所有可能性的“黄金模式”，如果您感兴趣的话。

当然，如果这些处理程序提供的功能不重要，这些事情可能不是问题。

【讨论】：