关于如何获取移动端 touchmove 事件中真正触摸点下方的元素
移动端的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> /// 移除控件的某类事件, 如 ...
随机推荐
- C++点滴20130724
warning c4627:"#include stdafx.h":在查找预编译头使用时跳过 原因: 1.没有添加 #include "stdafx.h" 2. ...
- 利用Dropbox同步Arch下一些软件的配置文件
一些软件后要好好的配置一番才能好好为自己所用,比如vim,比如conky等等,但是万一系统真出了问题,或者硬盘跪了,要重新安装系统重新配置的时候真是一种折磨,前阵子想到如果用dropbox同步那些配置 ...
- JAVA中HashMap和Hashtable区别
Hashtable和HashMap在Java面试中相当容易被问到,甚至成为了集合框架面试题中最常被考的问题,所以在参加任何Java面试之前,都不要忘了准备这一题. 我们先看2个类的定义 public ...
- 跟着弦哥学人工智能2—HAND-CRAFTED RULES实现的人工智能及其缺陷
隔壁有个妹纸喷我,好高兴....给她回复了下 哎呀,没想到是个妹纸,其实我就随便那么一说,没合计妹纸还专门写个檄文声讨我,受宠若惊其实你的评论一看就比较专业,所以我就去你博客大概扫了一眼,发现个大问 ...
- java 上传文件-生成文件首页缩略图 生成pdf 抓取图片
方法:1.文件转换成pdf(采用openoffice或者jacob) 2.抓取pdf首页图 第一步:采用jacob: a.下载jacob 注意区分32位,64位,否则不能用 将dll文件放在ja ...
- LeetCode 74. Search a 2D Matrix(搜索二维矩阵)
Write an efficient algorithm that searches for a value in an m x n matrix. This matrix has the follo ...
- JavaScript面向对象中的继承
1.1继承的基本概念 使用一个子类,继承另一个父类,那么子类可以自动拥有父类中的所有属性和方法,这个过程叫做继承. >>>继承的两方,发生在两个类之间. 实现继承的三种方式: 扩展O ...
- 快速部署PostgreSQL
PostgreSQL通常也简称Postgres,是一个关系型数据库管理系统,适用于各种Linux操作系统.Windows.Solaris.BSD和Mac OS X.本文基于CentOS7,使用yum源 ...
- 读书笔记-你不知道的JS上-闭包与模块
闭包定义 当函数可以记住并访问所在的词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行. 看一段最简单的闭包代码: function foo() { var a = 2; //闭包 fun ...
- 使用jQuery中trigger()方法自动触发事件
一.常用事件 在页面加载完成时 自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click") ...