移动端的touchstart, touchmove, touchend三个事件,点击元素并拖动时,获取到了touchmove事件, 但是event.touches[0].target所指向的元素却是touchstart时获取到的元素,而并非手指所移动到上方的元素,所以在处理获取移动到哪个元素上方之类的需求时,普通方法已不奏效,解决方式如下:
var element = document.elementFromPoint(event.originalEvent.pageX, event.originalEvent.pageY);
这样获取到的即为所需元素。
备注:不同版本可能获取方式不同,有的是利用下面的代码来获取
document.elementFromPoint(event.clientX, event.clientY);
例:
$('li').on('touchmove',function(){
var element = document.elementFromPoint(event.touches[0].pageX, event.touches[0].pageY);
})
转载原贴 http://blog.csdn.net/greatwang123/article/details/39496053
关于如何获取移动端 touchmove 事件中真正触摸点下方的元素的更多相关文章
-
获取移动端 touchend 事件中真正触摸点下方的元素
移动端的touchstart, touchmove, touchend三个事件,拖动元素结束时,获取到了touchend事件, 但是event.touches[0].target所指向的元素却是tou ...
-
移动端 touchmove高频事件与requestAnimationFrame的结合优化
移动端最高频耗内存的的操作 莫属 touchmove 与scroll事件 两者需要 微观的 优化,使用 requestAnimationFrame性能优化 H5性能优化requestAnimati ...
-
Touch事件在移动端web开发中的详解
一.pc端事件回顾 HTML事件.DOM0事件.DOM2事件 事件对象. 如果上述概念不清楚,请先去了解. 二.移动端事件简介 2.1 pc端事件在移动端的问题 移动设备主要特点是不配备鼠标,键盘 ...
-
移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法
这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且to ...
-
html .css 实现图片滑动和自动播放特效移动端 HTML 5中添加了以touch 开头的事件
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta ...
-
项目开发中的一些注意事项以及技巧总结 基于Repository模式设计项目架构—你可以参考的项目架构设计 Asp.Net Core中使用RSA加密 EF Core中的多对多映射如何实现? asp.net core下的如何给网站做安全设置 获取服务端https证书 Js异常捕获
项目开发中的一些注意事项以及技巧总结 1.jquery采用ajax向后端请求时,MVC框架并不能返回View的数据,也就是一般我们使用View().PartialView()等,只能返回json以 ...
-
GridView控件RowDataBound事件中获取列字段值的几种途径
前台: <asp:TemplateField HeaderText="充值总额|账号余额"> <ItemTemplate> <asp:Label ID ...
-
ng-change事件中如何获取$event和如何在子元素事件中阻止调用父级元素事件(阻止事件冒泡)
闲聊: 今天小颖要实现一个当改变了select内容后弹出一个弹框,并且点击select父元素使得弹框消失,这就得用到阻止事件的冒泡了:$event.stopPropagation(),然而小颖发现,在 ...
-
C# 有关控件、自定义类事件中的委托链的获取、移除操作
直接来代码吧,这样干脆直接,也不耽误我午休了.一切尽在源码中. public class ControlEventTool { /// <summary> /// 移除控件的某类事件, 如 ...
随机推荐
-
数字对象NSNumber
//将int类型转化成对象 ; NSNumber *numberString = [NSNumber numberWithInt:number]; //对象是可以放入数组的 NSArray *arra ...
-
C# —— IList, ArrayList与List的区别详解
共同点: IList, List , ArrayList 通俗一点来讲就是广义的数组,C#里面称之为集合.不同于一般的狭义的数组,它们可以存放任意类型的东西,在申明或者赋值的时候指定. 比如你写 ...
-
[iOS基础控件 - 6.2] LOL英雄列表 UITableView单项显示
A.需求 1.使用只有一个section的TableView来显示LOL 的英雄列表 2.内容包括标题.副标题.图标 3.使用plain样式 4.使用MVC模式 heros.plist 文件结 ...
-
java 泛型中 T、E ... 和 问号(通配符)的区别
一.泛型中T.E ... 是泛型类.泛型方法定义时候用的. 1.泛型类定义在类后面 紧跟类名后面 public class TestClassDefine<T>{} 2.泛型方法定义在方 ...
-
[非技术参考]C#基础:使用Thread创建线程(1)
Thread类可以创建和控制线程,Thread类的构造函数重载为接受ThreadStart和ParameterizedThreadStart类型的委托参数.下面我们用一个例子来解释怎样用Thread类 ...
-
[转] mongodb下载、安装、配置与使用
记得在管理员模式下运行CMD,否则服务将启动失败. 详细图解,记录 win7 64 安装mongo数据库的过程.安装的版本是 MongoDB-win32-x86_64-2008plus-ssl-3.4 ...
-
maya中MFnMesh.h使用说明的翻译
由于最近要修改一个maya中的deformer脚本,于是开始系统学习openMaya的一些知识,当然少不了得把一堆头文件说明看一遍.首先把MFnMesh.h这个文件翻译一下吧,不废话,上译文: 首先M ...
-
Centos下安装破解Jira7的操作记录
Jira是一个集项目计划.任务分配.需求管理.错误跟踪于一体的工具,可以作为一个bug管理系统,可以将在测试过程中所发现的bug录入.分配给开发人员.前面介绍了Confluence在Centos下的安 ...
-
[POI2011]Garbage 欧拉回路
[POI2011]Garbage 链接 https://www.lydsy.com/JudgeOnline/problem.php?id=2278 https://loj.ac/problem/216 ...
-
【BZOJ-1396&;2865】识别子串&;字符串识别 后缀自动机/后缀树组 + 线段树
1396: 识别子串 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 312 Solved: 193[Submit][Status][Discuss] ...