移动端touch事件

移动端所有的事件都基于touch事件。

一:touch事件:touchstart、touchmove、touchend和touchcancel

  1. touchstart:当手指碰触屏幕的时候触发;
  2. touchmove:当手指在屏幕中滑动时候连续触发。移动端在用这个事件的时候通常会调用e.preventDefault()来阻止默认触发的页面滚动事件。
  3. touchend:当手指离开屏幕的时候触发。
  4. touchcancel:系统停止跟踪触摸时候回触发。(一般很少用)

二:触摸点:可以通过事件的event获取需要的相关触摸点信息。(eg:event.touches[0])

  1. touches:页面上的所有触摸点 touches[0];
  2. targetTouches:目标元素的所有当前触摸点;
  3. changedTouches:页面上最新更改的所有触摸点。

三:在每个触摸点中可以获取以下属性:

  1. clientX:触发目标在视口中的X坐标;
  2. clientY:
  3. pageX:触摸目标在页面中的x坐标;
  4. pageY:
  5. screenX:触发目标在屏幕中的X坐标;
  6. screenY:
  7. target:触摸的DOM节点坐标。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容