2017-06-30 37 views
0

刷卡的角度,我有以下代码:如何从JavaScript的触摸事件

swipeDetect = function(el, callback){ 

    var touchsurface = el, 
    swipedir, 
    startX, 
    startY, 
    distX, 
    distY, 
    threshold = 7, //required min distance traveled to be considered swipe 
    restraint = 100, // maximum distance allowed at the same time in perpendicular direction 
    allowedTime = 500, // maximum time allowed to travel that distance 
    maxangle=40, 
    elapsedTime, 
    startTime, 
    touchinprocess=false, 
    handleswipe = callback || function(swipedir){}; 

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

     touchinprogress = true; 
     var touchobj = e.changedTouches[0]; 
     swipedir = 'none'; 
     dist = 0; 
     startX = touchobj.pageX; 
     startY = touchobj.pageY; 
     startTime = new Date().getTime(); 
    }, false); 

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


     var touchobj = e.changedTouches[0]; 
     distX = startX - touchobj.pageX; 
     distY = startY - touchobj.pageY; 
     rads = Math.atan(distY,distX); 
     var deg = rads * (180/3.14); 
     console.log(deg); 
     if (Math.abs(distY) > restraint && Math.abs(deg) > maxangle) e.preventDefault(); 

    }, false); 

    touchsurface.addEventListener('touchend', function(e){ 

     var touchobj = e.changedTouches[0]; 
     distX = touchobj.pageX - startX; 
     distY = touchobj.pageY - startY; 
     elapsedTime = new Date().getTime() - startTime; 

     if (elapsedTime <= allowedTime){ // first condition for awipe met 
      if (Math.abs(distX) >= threshold && Math.abs(distY) <= restraint){ // 2nd condition for horizontal swipe met 
       swipedir = (distX < 0)? 'left' : 'right'; // if dist traveled is negative, it indicates left swipe 
      } 
      else if (Math.abs(distY) >= threshold && Math.abs(distX) <= restraint){ // 2nd condition for vertical swipe met 
       swipedir = (distY < 0)? 'up' : 'down'; // if dist traveled is negative, it indicates up swipe 
      }; 
     }; 
     handleswipe(e,swipedir); 
     return true; 
    }, false); 
}, 

我试图让度的触摸移动功能的触摸滑动的角度(并杀死默认如果滑动超过特定数量的度数,则滚动)。但它一直输出80左右的数字。不管我怎么刷卡。这里有什么问题?

我使用这个图像刷卡,我想让用户刷卡,并没有它滚动和同时刷卡。

也许我正在谈论这一切都是错误的。

感谢您的帮助。

回答