Xác định Tap dài (Long Press, Tap Hold) trên Android với jQuery

Question

Tôi đã có thể successfully play với các sự kiện chạm, chạm và chạm trên Android bằng cách sử dụng jQuery và một trang HTML. Bây giờ tôi đang cố gắng để xem những gì các trick là để xác định một sự kiện tap dài, nơi một vòi và giữ trong 3 giây. Tôi không thể hình dung ra điều này. Tôi muốn điều này hoàn toàn trong jQuery mà không có Sencha Touch, JQTouch, jQMobile, v.v.

Tôi thích khái niệm jQTouch, mặc dù nó không cung cấp cho tôi nhiều và một số mã của tôi bị ngắt. Với Sencha Touch, tôi không phải là một fan của việc chuyển từ jQuery sang Ext.js và một số cách làm trừu tượng Javascript, đặc biệt là khi jQuery có khả năng như vậy. Vì vậy, tôi muốn tìm hiểu điều này với jQuery một mình. Tôi đã có thể làm nhiều jQTouch và Sencha Touch những thứ trên của riêng tôi bằng cách sử dụng jQuery. Và jQMobile vẫn còn quá beta và chưa đủ hướng đến Android.

Answer 1

Thời gian không được sử dụng nhưng sẽ chỉ kích hoạt sau khi người dùng thả ngón tay sau một lần nhấn.

var startTime, endTime; 
var gbMove = false; 

window.addEventListener('touchstart',function(event) { 
    startTime = new Date().getTime(); 
    gbMove = false;   
},false); 

window.addEventListener('touchmove',function(event) { 
    gbMove = true; 
},false); 

window.addEventListener('touchend',function(event) { 
    endTime = new Date().getTime(); 
    if(!gbMove && (endTime-startTime)/1000 > 2) 
     alert('tap hold event');  
},false); 

Answer 2

var gnStartTime = 0; 
var gbMove = false; 
var gbStillTouching = false; 

function checkTapHold(nID) { 
    if ((!gbMove) && (gbStillTouching) && (gnStartTime == nID)) { 
    gnStartTime = 0; 
    gbMove = false; 
    alert('tap hold event');  
    } 
} 

window.addEventListener('touchstart',function(event) { 
    gbMove = false; 
    gbStillTouching = true; 
    gnStartTime = Number(new Date()); 
    setTimeout('checkTapHold(' + gnStartTime + ');',2000); 
},false); 

window.addEventListener('touchmove',function(event) { 
    gbMove = true; 
},false); 

window.addEventListener('touchend',function(event) { 
    gbStillTouching = false; 
},false); 

Answer 3

Tại sao không chỉ sử dụng hẹn giờ js? Tôi đã làm một cái gì đó như:

i=0; 
$drink = document.getElementById('drink'); 
$drink.addEventListener('touchstart',function(event){ 
    $('#drink .mainBtnText').text('HOLD'); //mostly for debugging 
    t = window.setInterval(function(event){ 
      i+=.5; 
      if (i>=1){ 
       alert('taphold'); 
       window.clearInterval(t); 
       i=0; 
      } 
     },500); 
}); 
$drink.addEventListener('touchend',function(event){ 
    $('#drink .mainBtnText').text('Drink'); 
    i=0; 
    window.clearInterval(t); 
}); 

Và tôi đã hoàn toàn không có rắc rối với nó vậy, đến nay ... thừa nhận, tôi đã không thực hiện kiểm định phương tiện vô cùng rộng lớn, nhưng nó làm việc trên máy tính để bàn của tôi (với mousedown/mouseup) cũng như một HTC Droid Eris (Android 1.6) và Droid RAZR của tôi (Android 2.3) ...

Answer 4

tôi đã làm một cái gì đó như thế này:

var touchCounter; 

window.addEventListener('touchstart', function() { 
    var count = 0; 
    touchCounter = setInterval(function() { 
    count++; 
    if (count == 10) alert('touch lasted 10 seconds'); 
    }, 1000); 
}); 

window.addEventListener('touchend', function() { 
    clearInterval(touchCounter); 
    touchCounter = null; 
}); 

Answer 5

Mặc dù nó không phải là jQuery nhưng tôi đã thực hiện theo cách này trong ứng dụng Android của tôi:

1. sự kiện đăng ký người nghe:

   var touchStartTimeStamp = 0; 
   var touchEndTimeStamp = 0; 
   
   window.addEventListener('touchstart', onTouchStart,false); 
   window.addEventListener('touchend', onTouchEnd,false); 
   

2. chức năng thêm:

   var timer; 
   function onTouchStart(e) { 
       touchStartTimeStamp = e.timeStamp; 
   } 
   
   function onTouchEnd(e) { 
       touchEndTimeStamp = e.timeStamp; 
   
       console.log(touchEndTimeStamp - touchStartTimeStamp);// in miliseconds 
   } 
   

3. kiểm tra sự khác biệt thời gian và làm công cụ của tôi

Tôi hy vọng điều này sẽ giúp.