2016-07-13 4 views
0

Есть ли способ отслеживать, как долго пользователь держит палец, и каждые 1 секунду что-то меняет что-то в html.Touchstart, touchhend счетчик javascript

Я нашел этот пример http://jsfiddle.net/7Z6hg/ в одном сообщении, но это с keydown.

$(function() { 
    var keyTimes = {}; 

    $(document).keydown(function (e) { 
     if (keyTimes["key" + e.which]) { 
      return false; 
     } 
     keyTimes["key" + e.which] = new Date().getTime(); 
    }); 

    $(document).keyup(function (e) { 
     if (keyTimes["key" + e.which]) { 
      var x = new Date().getTime() - keyTimes["key" + e.which]; 
      delete keyTimes["key" + e.which]; 
      $("<p />").text("Held key " + e.which + " for " + x/1000.0 + " seconds").appendTo("div"); 
     } 
    }); 
}); 

Есть события для сенсорных устройств?

Спасибо за помощь!

ответ

0
  • Использование Date-object получить Date, на котором событие инициируется
  • Используйте +(Unary plus), чтобы получить временную метку в Date-object
  • Разделив разность по 1000 вернется seconds

var elem = document.getElementById('elem'); 
 
var date; 
 
elem.addEventListener('touchstart', function() { 
 
    date = +new Date(); 
 
}); 
 
elem.addEventListener('touchend', function() { 
 
    var diff = +new Date() - date; 
 
    console.log((diff/1000).toFixed(2) + ' seconds'); 
 
});
#elem { 
 
    width: 100%; 
 
    height: 200px; 
 
    background-color: green; 
 
}
<div id="elem">Element</div>

+0

он работает! Спасибо! – UnLi

+0

@UnLi Конечно ... Надеюсь, вы знаете, как работают эти события ... – Rayon