JQuery写法:

$('#id').on('touchstart',function(e) {
var _touch = e.originalEvent.targetTouches[0];
var _x= _touch.pageX;
}); $('#id').on('touchmove',function(e) {
var _touch = e.originalEvent.targetTouches[0];
var _x= _touch.pageX;
}); $('#id').on('touchend',function(e) {
var _touch = e.originalEvent.changedTouches[0];
var _x= _touch.pageX;
}

原生写法:

document.getElementById("id").addEventListener("touchstart",function(e)
{
var _x=e.touches[0].pageX;
var _y=e.touches[0].pageY;
console.log("start",_x)
})
document.getElementById("id").addEventListener("touchmove",function(e)
{
var _x=e.touches[0].pageX;
var _y=e.touches[0].pageY;
console.log("move",_x)
})
document.getElementById("id").addEventListener("touchend",function(e)
{
var _x=e.changedTouches[0].pageX;
var _y=e.changedTouches[0].pageY;
console.log("end",_x)
})

以上两种办法中 touchend 需要使用changedTouches[0]

一般我们取第一个手指的坐标,如果有其他要求可能 需要判断手指数量

if (e.targetTouches.length == 1)
{
  //...
}

顺带贴出常用的一句

e.preventDefault();

JQuery 获取touchstart,touchmove,touchend 坐标的更多相关文章

  1. JQuery获取touchstart,touchmove,touchend坐标

    $('#id').on('touchstart',function(e) { ].pageX; }); JQuery如上. document.getElementById("id" ...

  2. 获取touchstart,touchmove,touchend 坐标

    简单说下如何用jQuery 和 js原生代码获取touchstart,touchmove,touchend 坐标值: jQuery 代码: $('#id').on('touchstart',funct ...

  3. jQuery的touchstart,touchmove,touchend的获取位置

    $('#webchat_scroller').on('touchstart',function(e) { var touch = e.originalEvent.targetTouches[0]; v ...

  4. 移动端的touchstart,touchmove,touchend事件中的获取当前touch位置

    前提:touchstart,touchmove,touchend这三个事件可以通过原生和jq绑定. 原生:document.querySelector("#aa").addEven ...

  5. jquery获取当前元素的坐标

    jquery获取当前元素的坐标 1,获取对象 var obj = $("#id号"); 或  var obj = $(this); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗 ...

  6. 移动端touchstart,touchmove,touchend

    近段时间使用html5开发一个公司内部应用,而触摸事件必然是移动应用中所必须的,刚开始以为移动设备上或许也会支持鼠标事件,原来是不支持的,好在webkit内核的移动浏览器支持touch事件,并且打包成 ...

  7. touchstart,touchmove,touchend触摸事件的小小实践心得

    近段时间使用html5开发一个公司内部应用,而触摸事件必然是移动应用中所必须的,刚开始以为移动设备上或许也会支持鼠标事件,原来是不支持的,好在webkit内核的移动浏览器支持touch事件,并且打包成 ...

  8. 利用jQuery获取鼠标当前的坐标

    文字来源:http://www.smalluv.com/jquery_code_106.html jQuery获取当前鼠标坐标位置: <div id="testDiv"> ...

  9. touchstart,touchmove,touchend事件 写法

    jQuery写法: $('#id').on('touchstart',function(e) { var _touch = e.originalEvent.targetTouches[0]; var ...

随机推荐

  1. laravel的一些坑

    1.laravel 本身的性能不行,对高性能服务器,需要使用lumen 2. {{$url}} 默认会执行 htmlentities ,进行转意义,如果不需要转义可直接使用 php的echo 或者 { ...

  2. xmpp整理笔记:xmppFramework框架的导入和介绍

    一个将要开发xmpp的项目,建议在项目刚创建就导入框架,这样可以避免一些自己操作失误造成不必要的损失. xmpp中最常用的框架就是 xmppFrameWork 往期回顾: xmpp整理笔记:环境的快速 ...

  3. System.Security.Cryptography.CryptographicException: 指定了无效的提供程序类型

    这两天在调用银联在线的支付接口,把银联提供的demo代码copy过来放到自己网站上,生成通过了,但是运行的时候就报错了: 指定了无效的提供程序类型. 说明: 执行当前 Web 请求期间,出现未经处理的 ...

  4. ios8版本地图定位注意点

    学习ios地图定位 我先定义一个属性: @property (weak, nonatomic) IBOutlet MKMapView *mapV; 然后在项目运行时初始化该属性一些参数: //设置地图 ...

  5. JQuery制作简单的网页导航特效

    使用JQuery中hover()方法,使其根据鼠标的移动简单的改变背景颜色; hover();用于模拟鼠标指针悬停事件,当鼠标指针移动到元素上时,会触发指定的第一个函数,当鼠标指针移除这个元素时,会触 ...

  6. Hierarchyid 常用操作

        ---------内置函数------------ select hierarchyid::GetRoot()--0x select hierarchyid::Parse('/1/1/') - ...

  7. symfony2 路由工作原理及配置

    1.路由是程序的方法和URL的一一映射.

  8. git各种命令介绍以及碰到的各种坑

    一.各种命令介绍: git pull:从其他的版本库(既可以是远程的也可以是本地的)将代码更新到本地,例如:'git pull origin master'就是将origin这个版本库的代码更新到本地 ...

  9. Hibernate 缓存介绍

    Hibernate中提供了两级缓存,一级缓存是Session级别的缓存,它属于事务范围的缓存,该级缓存由hibernate管理,应用程序无需干预:二级缓存是SessionFactory级别的缓存,该级 ...

  10. Maven详细介绍

    Maven 目录 1 什么是Maven? 2 Maven 的好处 3 获取和安装 3.1 获取 3.2 安装 3.2.1 环境变量的配置 4 设置本地仓库 5 创建简单的Maven实例 5.1 使用骨 ...