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. IDA调试android so文件.init_array和JNI_OnLoad

    我们知道so文件在被加载的时候会首先执行.init_array中的函数,然后再执行JNI_OnLoad()函数.JNI_Onload()函数因为有符号表所以非常容易找到,但是.init_array里的 ...

  2. BMP图像数据格式详解

    一.简介 BMP(Bitmap-File)图形文件是Windows采用的图形文件格式,在Windows环境下运行的所有图象处理软件都支持BMP图象文件格式.Windows系统内部各图像绘制操作都是以B ...

  3. Android-SQLite版本问题

    1. 用户 重来没有使用过该软件 不存在数据库,我们 1). 自动调用 void onCreate(SQLiteDatabase db) 方法 创建数据库 2).创建 表 , 3).给表插入初始化数据 ...

  4. Android 图片的合成

    本文实现在Android下图片的合成 布局设计比较简单: <RelativeLayout xmlns:android="http://schemas.android.com/apk/r ...

  5. Android NDK目录介绍

    交叉编译 在一个平台上去编译另一个平台上可以执行的本地代码 cpu平台---arm x86 mips 操作系统平台---windows linux mac os 原理 模拟不同平台的特性去编译代码 j ...

  6. 【代码笔记】iOS-和当前时间比较

    代码: #import "RootViewController.h" @interface RootViewController () @end @implementation R ...

  7. socket编程listen函数限制连接数的解决方案

    函数原型: int listen(int sockfd, int backlog); 当服务器编程时,经常需要限制客户端的连接个数,下面为问题分析以及解决办法: 下面只讨论TCP  UDP不做讨论(很 ...

  8. 【Android】不使用WebView来执行Javascript脚本(Rhino)

    前言 动态执行脚本能有效的降低重要功能硬编码带来的问题,尤其是依赖于第三方的应用,可以通过动态脚本+在线参数(例如友盟在线参数)再不更新应用的情况下升级功能. 声明 欢迎转载,但请保留文章原始出处:) ...

  9. 安卓学习-- RecyclerView简单入门

    一.加入JAR包 第一感觉这个东东,好复杂,没ListView来的快,方便 在项目中加入android-support-v7-recyclerview.jar包 这个包在extras\android\ ...

  10. View相关知识学习总结

    (一)LayoutInflater原理分析 LayoutInflater主要用于加载布局.通常情况下,加载布局的任务都是在Activity中调用setContentView()方法来完成的,该方法内部 ...