2016-07-13 25 views
0

Gibt es eine Möglichkeit zu verfolgen, wie lange Benutzer Finger hält, und jede 1 Sekunde etwas in HTML ändern.Touchstart, Touchend Javascript Zähler

Ich fand dieses Beispiel http://jsfiddle.net/7Z6hg/ in einem Beitrag, aber es ist mit 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"); 
     } 
    }); 
}); 

Gibt es Ereignisse für Touch-Geräte?

Vielen Dank für Ihre Hilfe!

Antwort

0
  • Verwenden Date-object die Date zu erhalten, an dem Ereignis
  • Verwendung +(Unary plus) initiiert wird Zeitstempel des Date-object
  • Teilen der Differenz durch 1000 bekommen 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>
zurückkehren

+0

es funktioniert! Vielen Dank! – UnLi

+0

@UnLi Natürlich ... Ich hoffe du weißt wie das funktioniert ... – Rayon