简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - tap事件是怎么模拟出来的？移动端触摸事件是怎么一个流程？
PHP中文网
PHP中文网 2017-04-11 10:24:37
0
2
409

手机端事件触发过程
touchstart>touchend>tap +300ms>click
这个是移动端一次点击的流程吗？
为什么zepto中有个延时250呢？

//zepto中的代码 touchTimeout = setTimeout(function(){ touchTimeout = null if (touch.el) touch.el.trigger('singleTap') touch = {} }, 250)
PHP中文网
PHP中文网

认证0级讲师

Antworte allen (2)
PHPzhong
PHPzhong2017-04-11 10:26:37 2 Etage

这个延迟是singleTap事件的延迟，用来区分single和double tap

如果是单击的话：
touchstart>touchend>tap>250ms>singleTap

如果是双击的话：
touchstart>touchend>tap>touchstart>touchend>doubleTap

回到你的问题tap事件是怎么模拟的，源码上还是挺清楚的，具体过程如下：

  1. 首先tap是在touchend之后时触发的

  2. 触发条件一，位移不能大：touchstart和touchend两个位置之间不能有超过横向或者纵向30px的位移

  3. 触发条件二，时间不能长：touchstart到touchend之间超过750ms

Wie+0
Antwort hinzufügen
    左手右手慢动作
    左手右手慢动作2017-04-11 10:26:37 1 Etage

    楼上正解。这个是延迟用来区分单击或双击的。

    Wie+0
    Antwort hinzufügen
      Beliebte Themen
      Mehr>
      Populäre Artikel
      Beliebte Tutorials
      Mehr>
      Verwandte Tutorials
      Beliebte Empfehlungen
      Aktuelle Kurse
      Neueste Downloads
      Mehr>
      Web-Effekte
      Quellcode der Website
      Website-Materialien
      Frontend-Vorlage
      Über uns Haftungsausschluss Sitemap
      Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！