移动端的事件

基本事件:

  • touchstart //手指刚接触屏幕时触发
  • touchmove //手指在屏幕上移动时触发
  • touchend //手指从屏幕上移开时触发
  • touchcancel //触摸过程被系统取消时触发

每个事件都有以下列表,比如touchend的targetTouches当然是 0 咯:

  • touches //位于屏幕上的所有手指的列表
  • targetTouches //位于该元素上的所有手指的列表
  • changedTouches //涉及当前事件的所有手指的列表

每个事件有列表,每个列表还有以下属性:

其中坐标常用pageX,pageY:

  • pageX //相对于页面的 X 坐标
  • pageY //相对于页面的 Y 坐标
  • clientX //相对于视区的 X 坐标
  • clientY //相对于视区的 Y 坐标
  • screenX //相对于屏幕的 X 坐标
  • screenY //相对于屏幕的 Y 坐标
  • identifier // 当前触摸点的惟一编号
  • target //手指所触摸的 DOM 元素

其他相关事件:

  • event.preventDefault() //阻止触摸时浏览器的缩放、滚动条滚动
  • var supportTouch = "createTouch" in document //判断是否支持触摸事件
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 移动端视窗 <meta name="viewport" content="width=device-width, ...
    楚乌阅读 793评论 0 0
  • 触摸事件: 三种在规范中列出并获得跨移动设备广泛实现的基本触摸事件: 1.touchstart:手指放在一个DOM...
    晨光2016阅读 24,308评论 0 13
  • 13.1 事件流 “DOM2级事件”规定事件流包括3个阶段:事件捕获阶段,处于目标阶段,事件冒泡阶段。事件捕获表示...
    Elevens_regret阅读 3,335评论 0 0
  • 事件流 IE和Netscape开发团队提出了完全相反的两种事件流的概念,事件冒泡流和事件捕获流。 事件冒泡 事件由...
    exialym阅读 4,547评论 0 9
  • 没有什么比得到家人和朋友的支持 更让人幸福 更有力量的事情了 一直犹豫是否要自己做一次艰难的决定 还在犹豫时 没忍...
    晴天儿阅读 1,131评论 0 1