jQuery touch事件iOS不会工作

Question

我在iOS中遇到了jQuery touch事件问题。

这里是我做了什么：

$(document).ready(function(){ 
     var iX = 0,iY = 0,fX = 0,fY = 0; 

     document.addEventListener('touchstart', function(e) { 

      var touch = e.touches[0]; 
      iX = touch.pageX; 
      iY = touch.pageY; 

     }, false); 

     document.addEventListener('touchmove', function(e) { 

      var touch = e.touches[0]; 
      fX = touch.pageX; 
      fY = touch.pageY; 

     }, false); 

     document.addEventListener('touchcancel', function() { 

      var dX = fX - iX; 
      var dY = fY - iY; 

      var tg = dY/dX; 
      if(tg < 0) tg = -tg; 

      if(tg <= 0.5 && fX > iX) rightSwipe() 
      else if(tg <= 0.5 && fX < iX) leftSwipe() 

     }, false); 

     function rightSwipe(){ 
      $("#body").removeClass("bg2"); 
      $("#body").addClass("bg"); 
     } 

     function leftSwipe(){ 
      $("#body").removeClass("bg"); 
      $("#body").addClass("bg2"); 
     } 
}); 

当你触摸你的手指到屏幕，这样可以节省手指位置。 当您移动手指并释放它时，它会保存最后一根手指的位置。 通过简单的几何图形，它可以发现您滑动的方向。

此脚本在Android 4.1.2上使用Google Chrome和Android默认浏览器运行良好。 当我在iOS上使用Safari尝试它时，它不起作用。

有人可以帮忙吗？

Answer 1

我还没有在iPad上的Mobile Safari上看到touchcancel事件。您是否尝试过使用touchend？也许这：

function upHandler(event) { 

    var dX = fX - iX; 
    var dY = fY - iY; 

    var tg = dY/dX; 
    if (tg < 0) tg = -tg; 

    if (tg <= 0.5 && fX > iX) rightSwipe() 
    else if (tg <= 0.5 && fX < iX) leftSwipe() 
} 

document.addEventListener('touchcancel', upHandler, false); 
document.addEventListener('touchend', upHandler, false); 

如果你使用jQuery，您可以替换此：

document.addEventListener('touchcancel', upHandler, false); 
document.addEventListener('touchend', upHandler, false); 

有了：

$(document).on('touchcancel, touchend', upHandler);