zoukankan      html  css  js  c++  java
  • 移动端touch mouse click事件的触发顺序

    在移动端页面上,一次点击行为,会触发touch、mouse、click事件,规则如下:

    Stage 1: 手指按在屏幕上,立即触发touchstart。

    Stage 2: 手指离开屏幕,这里分2种情况:

      如果手指在屏幕上的停留时间少于500ms,会依次触发 touchend->mousemove->mousedown->mouseup->click。事件间的时间间隔非常短。

      如果手指在屏幕上的停留时间大于500ms,只会触发touchend。

    如果手指在屏幕上产生了移动,则不论停留时间多长,都只会触发 touchmove->touchend。

    如果是在微信浏览器,一旦手指停留超过500ms,会立即触发一次mousemove,然后在手指离开的时候触发touchend。

    另外,超过500ms的长按会触发浏览器的选中复制的弹框,css的 touch-callout:none; 可以禁止弹框,不过兼容性不佳。

  • 相关阅读:
    Redux
    版本控制(.git + .svn + SourceTree)
    前端埋点
    前端IDE:VSCode + WebStorm
    浏览器
    Mutation Observer
    函数节流与函数去抖
    React 初识
    Ajax
    JS
  • 原文地址:https://www.cnblogs.com/yangshifu/p/12195322.html
Copyright © 2011-2022 走看看