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. Mac系统如何编辑hosts文件

    Mac系统如何编辑hosts文件 Hosts 是一个没有扩展名的系统文件,其作用就是将一些常用的网址域名与其对应的IP地址建立一个关联“数据库”,当用户在浏览器中输入一个需要登录的网址时,系 统会首先 ...

  2. mysql一些小技巧

    1 强制命中索引:force index 某些时候查询,索引会失效,可以进行强制命中索引 2 group_concat 能将相同的行组合起来. 当然,我推荐这种操作可以在代码中操作,如果必须在特定情况 ...

  3. python urllib2 发起http请求post

    使用urllib2发起post请求 def GetCsspToken(): data = json.dumps({"userName":"wenbin", &q ...

  4. 今天说一下DML触发器的顺序

    因为05之后的版本允许了一个对象有多个after触发器,所以呢~顺序方面还是要留意一下下的.比如我现在要往一个测试表里面添加多个触发器. USE Test GO ,),Name )) GO CREAT ...

  5. Linux IPC System V 信号量

    模型 #include <sys/types.h> #include <sys/ipc.h> #include <sys/sem.h> ftok() //获取key ...

  6. 2. Docker - 安装

    一.Docker介绍 1. Docker是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux机器上, 也可以实现虚拟化. 容器时完全使用沙 ...

  7. 一、Android学习第一天——环境搭建(转)

    (转自:http://wenku.baidu.com/view/af39b3164431b90d6c85c72f.html) 一. Android学习第一天——环境搭建 Android 开发环境的搭建 ...

  8. 一:c语言(数据类型和运算符)

    #include <stdio.h> /*就是一条预处理命令,它的作用是通知C语言编译系统在对C程序进行正式编译之前需做一些预处理工作.*/ int main() /*C程序就是执行主函数 ...

  9. js实现打开网页自动弹出添加QQ好友邀请窗口

    我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是 ...

  10. 大话设计模式C++版——观察者模式

    观察者模式是一种类似于消息分发的模式,用于一个任务需要被多个对象监听的场景,或者成员对象需要反向通知类对象的情况,是一种很有用的设计模式.    这里以大话设计模式中的例子为例,办公室员工A.B.C在 ...