touches: 当前屏幕上所有触摸点的列表;

targetTouches: 当前对象上所有触摸点的列表;

changedTouches: 涉及当前(引发)事件的触摸点的列表

通过一个例子来区分一下触摸事件中的这三个属性:

1. 用一个手指接触屏幕,触发事件,此时这三个属性有相同的值。

2. 用第二个手指接触屏幕,此时,touches有两个元素,每个手指触摸点为一个值。当两个手指触摸相同元素时,
targetTouches和touches的值相同,否则targetTouches 只有一个值。changedTouches此时只有一个值,
为第二个手指的触摸点,因为第二个手指是引发事件的原因

3. 用两个手指同时接触屏幕,此时changedTouches有两个值,每一个手指的触摸点都有一个值

4. 手指滑动时,三个值都会发生变化

5. 一个手指离开屏幕,touches和targetTouches中对应的元素会同时移除,而changedTouches仍然会存在元素。

6. 手指都离开屏幕之后,touches和targetTouches中将不会再有值,changedTouches还会有一个值,
此值为最后一个离开屏幕的手指的接触点。

2. 触点坐标选取

touchstart和touchmove使用: e.targetTouches[0].pageX 或 (jquery)e.originalEvent.targetTouches[0].pageX

touchend使用: e.changedTouches[0].pageX 或 (jquery)e.originalEvent.changedTouches[0].pageX

3.touchmove事件对象的获取

想要在touchmove:function(e,参数一)加一个参数,结果直接使用e.preventDefault()就会 e 报错,处理方法为使用arguments[0]获取event参数
touchmove:function(e,参数一){
  var e=arguments[0]
  e.preventDefault()
}

出处:http://blog.sina.com.cn/s/blog_468530a60102wzkw.html

转载于:https://www.cnblogs.com/mengff/p/6005516.html

touch事件中的touches、targetTouches和changedTouches详解相关推荐

  1. linux屏幕触碰事件,touch事件中的touches、targetTouches和changedTouches详解

    touches: 当前屏幕上所有触摸点的列表; targetTouches: 当前对象上所有触摸点的列表; changedTouches: 涉及当前(引发)事件的触摸点的列表 通过一个例子来区分一下触 ...

  2. touch事件中的touches、targetTouches和changedTouches详解(转)

    1.属性详解 touches: 当前屏幕上所有触摸点的列表; targetTouches: 当前对象上所有触摸点的列表; changedTouches: 涉及当前(引发)事件的触摸点的列表 通过一个例 ...

  3. touch事件中的touches、targetTouches和changedTouches(详解)

    touches: 当前屏幕上所有触摸点的列表;targetTouches: 当前对象上所有触摸点的列表;changedTouches: 涉及当前(引发)事件的触摸点的列表通过一个例子来区分一下触摸事件 ...

  4. Android 事件分发机制分析及源码详解

    Android 事件分发机制分析及源码详解 文章目录 Android 事件分发机制分析及源码详解 事件的定义 事件分发序列模型 分发序列 分发模型 事件分发对象及相关方法 源码分析 事件分发总结 一般 ...

  5. 教程-Delphi中Spcomm使用属性及用法详解

    Delphi中Spcomm使用属性及用法详解 Delphi是一种具有 功能强大.简便易用和代码执行速度快等优点的可视化快速应用开发工具,它在构架企业信息系统方面发挥着越来越重要的作用,许多程序员愿意选 ...

  6. 【转】angularjs指令中的compile与link函数详解

    这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在使用 ...

  7. python怎么横着输出_对python3中, print横向输出的方法详解

    对python3中, print横向输出的方法详解 Python 2 : print打印的时候,如果结尾有逗号,打出来时候不会换行.但是在python3里面就不行了. Python3: 3.0的pri ...

  8. python argv 详解_对python中的argv和argc使用详解

    主要问题 为什么argv中第一个,即index=0的内容就是文件名? python中argc是用什么实现的? 概念解释 argc:argument counter,命令行参数个数 argv:argum ...

  9. yii mysql 事务处理_Yii2中事务的使用实例代码详解

    前言 一般我们做业务逻辑,都不会仅仅关联一个数据表,所以,会面临事务问题. 数据库事务(Database Transaction) ,是指作为单个逻辑工作单元执行的一系列操作,要么完全地执行,要么完全 ...

最新文章

  1. 《Bigtable:a distributed storage system for struct data》笔记
  2. MariaDB Galera 集群安装配置
  3. linux .ssh隐藏,linux安全配置-将ssh服务隐藏于Internet(端口碰撞)
  4. WebRTC视频编解码器性能评估
  5. which kinds of error message will prevent business transaction save
  6. linux监测node进程,通过node_exporter监控linux服务器一
  7. 做骨龄检测_小柚熊:骨龄测试最佳年龄
  8. Windows 下安装 Scala
  9. python将一个文本文件复制到另一个文件中_使用Python逐行从一个文本文件复制到另一个文本文件...
  10. 极光IM简单代码(代码比较清晰)
  11. 在mysql中 创建视图需要使用_语句_在MySQL中创建视图的X种方式
  12. c语言求正弦余弦正切,公式( 正弦 余弦 正切 余切 正割 余割 )
  13. Tomcat设置开机启动 - CentOS(结尾附视频)
  14. 苹果x屏幕多少钱_北京苹果手机维修为大家分享iPadAir2换屏幕多少钱
  15. 【PTA题目】7-4 计算物体自由下落的距离 (5 分)
  16. 科目二经验之谈 10小时必过秘笈
  17. ES6高级:扩展运算符,箭头函数,class类,iterator迭代器
  18. echarts:饼图标签formatter的使用/饼图自定义标签
  19. Tableau豆瓣电影项目实战作业 Day1
  20. 快速获取网页元素xpath的方法

热门文章

  1. configure 时-g 与 -O0 开关控制
  2. MySQL的卸载与安装(附管理工具Navicat SQLyog)
  3. 几何级数的计算机验证法c语言解析,c语言编程20例.doc
  4. 文件管理软件,将文件按名称归类移动到另一个文件夹中
  5. 每日一练:web--Simple_SSTI_1
  6. 详解热备份路由协议(HSRP)
  7. UWB 技术原理与应用详解
  8. java eclipse旅店管理系统代码_运用Java语言与Eclipse开发工具完成酒店管理系统的设计与实现...
  9. visual basic (1)入门
  10. TDD 测试驱动开发与精益