Heim  >  Artikel  >  Web-Frontend  >  Die eigentliche Referenz des Touch-Ereignisses von js

Die eigentliche Referenz des Touch-Ereignisses von js

PHPz
PHPzOriginal
2016-05-16 16:34:111509Durchsuche

Die Suche nach dem entsprechenden technischen Support von jquery ist wirklich mühsam, während js nur ein paar einfache Schritte erfordert, um es mit Ihnen zu teilen von js.

Als ich zum ersten Mal anfing, an Frontend-Seiten zu arbeiten, kam ich mit js in Berührung, wurde dann aber von der einfachen und effizienten jquery angezogen und verwende sie seitdem.

Was js betrifft, habe ich es subjektiv als zugrunde liegende Technologie aufgegeben.

Bis zu den letzten Arbeitstagen habe ich mich mit Touchscreen-Schiebeereignissen auf mobilen Seiten beschäftigt. Die Suche nach der entsprechenden technischen Unterstützung von jquery ist wirklich mühsam (natürlich kann es sein, dass ich es nicht verstehe). jquery genug), während js nur ein paar Schritte erfordert.

Da ich wenig über js weiß, habe ich lange Zeit die einfachsten Anwendungen ausprobiert ... Lassen Sie mich die eigentliche Referenz des js-Touch-Events teilen:

$(function(){
document.addEventListener("touchmove", _touch, false);
})

function _touch(event){
alert(1);
}

Der obige Code verwendet zwangsläufig etwas von JQuery, und diejenigen, die JQuery nicht verwenden, können es ignorieren.

Die entsprechenden Ereignisse sind:

Touchstart: wird ausgelöst, wenn ein Finger den Bildschirm berührt; es wird auch dann ausgelöst, wenn sich bereits ein Finger auf dem Bildschirm befindet.
Touchmove: Wird kontinuierlich ausgelöst, wenn der Finger über den Bildschirm gleitet. Während dieses Ereignisses verhindert der Aufruf von „preventDefault()“ das Scrollen.
Touchend: Wird ausgelöst, wenn der Finger vom Bildschirm entfernt wird.
Touchcancel: Wird ausgelöst, wenn das System die Verfolgung von Berührungen stoppt. Das genaue auslösende Ereignis für dieses Ereignis ist aus der Dokumentation nicht ersichtlich.

Die folgenden Attribute sind für die Ereignisobjekte der oben genannten Ereignisse vorhanden:

Berührungen: Ein Array von Berührungsobjekten, die die aktuell verfolgten Berührungsvorgänge darstellen.
targetTouches: Array von Touch-Objekten, die für Ereignisziele spezifisch sind.
changeTouches: Ein Array von Touch-Objekten, das angibt, was sich seit der letzten Berührung geändert hat.

Jedes Touch-Objekt enthält die folgenden Eigenschaften:

clientX: Die X-Koordinate des Touch-Ziels im Ansichtsfenster.
clientY: Die Y-Koordinate des Touch-Ziels im Ansichtsfenster.
Bezeichner: Stellt die eindeutige ID der Berührung dar.
SeiteX: Die X-Koordinate des Berührungsziels auf der Seite.
SeiteY: Die Y-Koordinate des Berührungsziels auf der Seite.
screenX: Die x-Koordinate des Berührungsziels auf dem Bildschirm.
screenY: Die y-Koordinate des Berührungsziels auf dem Bildschirm.
Ziel: Koordinaten des berührten DOM-Knotens

Das Obige ist der gesamte Inhalt dieses Kapitels. Weitere verwandte Tutorials finden Sie unter JavaScript-Video-Tutorial!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn