處理Touch事件能讓你跟蹤使用者的每一根手指的位置,可以繫結以下四種Touch事件：

touchstart:  // 手指放到螢幕上的時候觸發 
touchmove:  // 手指在螢幕上移動的時候觸發 
touchend:  // 手指從螢幕上拿起的時候觸發 
touchcancel:  // 系統取消touch事件的時候觸發。至於系統什麼時候會取消，不詳

事件屬性一般通過 event.changedTouches獲得

client / clientY：// 觸控點相對於瀏覽器視窗viewport的位置 
pageX / pageY：// 觸控點相對於頁面的位置 
screenX /screenY：//觸控點相對於螢幕的位置 
identifier： // touch物件的unique ID
 

簡單實現

var startX=startY=0;
function touchSatrtFunc(e) {  
  e.preventDefault(); //阻止觸控時瀏覽器的縮放、滾動條滾動等  
  var touch = e.Touches[0]; //獲取第一個觸點  
  var x = Number(touch.pageX); //頁面觸點X座標  
  var y = Number(touch.pageY); //頁面觸點Y座標  
  startX = x;  
  startY = y; 
}  
//touchmove事件 
function touchMoveFunc(e) {  
  e.preventDefault(); //阻止觸控時瀏覽器的縮放、滾動條滾動等  
    var touch = e.touches[0];
    var x = touch.pageX - startX,
      y = touch.pageY - startY;
    var text = 'Move：（' + (x) + ', ' + y + '）';  
    document.title = text;
}  

//touchend事件 
function ToucheEndFunc(e) {  
  e.preventDefault(); //阻止觸控時瀏覽器的縮放、滾動條滾動等  
  var touch = e.changedTouches[0]; //獲取第一個觸點  

  var x = touch.pageX; //頁面觸點X座標	  
  var y = Number(touch.pageY); //頁面觸點Y座標  
  var text = 'end：（' + x + ', ' + y + '）';  
  document.title = text;
}