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] ,大家可以console.log(e) 進(jìn)去看下 還有很多方法

一般我們?nèi)〉谝粋€(gè)手指的坐標(biāo)，如果有其他要求可能 需要判斷手指數(shù)量

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

順帶說(shuō)下,有時(shí)可能需要禁止瀏覽器的默認(rèn)事件

e.preventDefault();