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. Ioc Autofac心得

    对于这个容器注入,个人也不是很熟悉,很多还不懂,只会基本的操作,几天把它记录下来,说不定以后帮助就大了呢,这方面跟安卓差距还是挺大的 下面记录下应用的流程 步骤: 1.添加应用 2.重写工厂(这里讲的 ...

  2. 操作系统开发系列—解释typedef void (*int_handler) ();

    于是我换了一个思路来理解这个typedef 我们首先看常规的变量定义: int INT//定义了一个名为INT的int型变量. char *c//定义了一个名为c的char型指针变量 void(*Fu ...

  3. 单独编译Android系统模块并替换进系统

    例如,我修改了frameworks\base\policy\src\com\android\internal\policy\impl\PhoneWindowManager.java文件,进入frame ...

  4. Gradle常用命令

    使用cmd进入Android studio项目的根目录就可以执行一些gradle相关命令 gradle -v 查看版本 (如果你是第一次执行会去下载Gradle,这个过程如果不FQ非常慢) gradl ...

  5. 关于OC中的block自己的一些理解(一)

    一.关于block 1.block的作用:保存一段代码. 2.苹果官方推荐的一种语法,类似于C语言的函数,但是比函数更加灵活. 3.^是block语法的标识. 二.block的用法 1)无返回值无参数 ...

  6. CGAffineTransformMakeRotation 实现旋转

    UIImageView *image = [[UIImageView alloc]init]; image.frame = CGRectMake(50, 50, 200, 200); image.im ...

  7. Percona XtraBackup User Manual 阅读笔记

    XtraBackup XtraBackup 2 安装XtraBackup 2.1 安装XtraBackup binary版本 2.1.1 yum的安装方法: 2.1.2 直接下载rpm包安装 3 Xt ...

  8. MaskedTextBox的聚焦和光标位置

    遇到一个关于MaskedTextBox聚焦和光标居左的问题. ①. 先说说聚焦: 起初给MaskedTextBox设置了Focus(),运行之后,并没有作用. 然后又给Form添加了Load事件,又设 ...

  9. Linux下NDK编译FFMPEG包含neon参数

    FFMPEG编译成Android库已经有很多案例了,编译优化neon的也很多,以下是我通过实践成功的案例,这里主要讲编译的配置文件,其他设置可结合Linux下使用NDK编译FFMPEG(libstag ...

  10. Windows Azure Backup Agent安装注意事项

    在Windows Server 2008 R2 SP1上安装Windows Azure Backup Agent时会出现错误: “Unable to execute the embedded appl ...