TouchEvent

Konstruktor

TouchEvent()

Erstellt ein TouchEvent-Objekt.

Instanz-Eigenschaften

Dieses Interface erbt Eigenschaften von seinem Elternteil, UIEvent und Event.

TouchEvent.altKey Schreibgeschützt

Ein Boolean-Wert, der angibt, ob die Alt-Taste gedrückt war, als das Touch-Event ausgelöst wurde.

TouchEvent.changedTouches Schreibgeschützt

Eine TouchList von allen Touch-Objekten, die einzelne Berührungspunkte darstellen, deren Status sich zwischen dem vorherigen Touch-Event und diesem geändert hat.

TouchEvent.ctrlKey Schreibgeschützt

Ein Boolean-Wert, der angibt, ob die Steuerungstaste gedrückt war, als das Touch-Event ausgelöst wurde.

TouchEvent.metaKey Schreibgeschützt

Ein Boolean-Wert, der angibt, ob die Meta-Taste gedrückt war, als das Touch-Event ausgelöst wurde.

TouchEvent.shiftKey Schreibgeschützt

Ein Boolean-Wert, der angibt, ob die Umschalttaste gedrückt war, als das Touch-Event ausgelöst wurde.

TouchEvent.targetTouches Schreibgeschützt

Eine TouchList von allen Touch-Objekten, die sich derzeit in Kontakt mit der Berührungsfläche befinden und auf demselben Element begonnen wurden, das das Ziel des Events ist.

TouchEvent.touches Schreibgeschützt

Eine TouchList von allen Touch-Objekten, die alle aktuellen Berührungspunkte mit der Oberfläche darstellen, unabhängig vom Ziel oder geändertem Status.

TouchEvent.rotation Nicht standardisiert Schreibgeschützt

Änderung der Rotation (in Grad) seit Beginn des Events. Positive Werte zeigen eine Drehung im Uhrzeigersinn an; negative Werte zeigen eine Drehung gegen den Uhrzeigersinn an. Anfangswert: 0.0.

TouchEvent.scale Nicht standardisiert Schreibgeschützt

Entfernung zwischen zwei Fingern seit Beginn des Events. Ausgedrückt als Gleitkomma-Multiplikator des anfänglichen Abstands zwischen den Fingern zu Beginn des Events. Werte unter 1.0 zeigen ein nach innen gerichtetes Kneifen (Herauszoomen) an. Werte über 1.0 zeigen ein nach außen gerichtetes Entkneifen (Hineinzoomen) an. Anfangswert: 1.0.

Touch-Event-Typen

Es gibt verschiedene Eventtypen, die ausgelöst werden können, um anzuzeigen, dass berührungsbezogene Änderungen aufgetreten sind. Sie können feststellen, welches dieser Events aufgetreten ist, indem Sie die TouchEvent.type-Eigenschaft des Events betrachten.

touchstart

Wird gesendet, wenn der Benutzer einen Berührungspunkt auf der Berührungsfläche platziert. Das Ziel des Events ist das Element, in dem die Berührung aufgetreten ist.

touchend

Wird gesendet, wenn der Benutzer einen Berührungspunkt von der Oberfläche entfernt; das heißt, wenn er einen Finger oder Stift von der Oberfläche hebt. Dies wird auch gesendet, wenn der Berührungspunkt den Rand der Oberfläche verlässt; beispielsweise, wenn der Finger des Benutzers vom Bildschirmrand gleitet.

Das Ziel des Events ist dasselbe Element, das das touchstart-Event erhalten hat, das dem Berührungspunkt entspricht, selbst wenn der Berührungspunkt sich außerhalb dieses Elements bewegt hat.

Der oder die Berührungspunkte, die von der Oberfläche entfernt wurden, können in der TouchList gefunden werden, die durch das changedTouches-Attribut angegeben wird.

touchmove

Wird gesendet, wenn der Benutzer einen Berührungspunkt entlang der Oberfläche bewegt. Das Ziel des Events ist dasselbe Element, das das touchstart-Event erhalten hat, das dem Berührungspunkt entspricht, selbst wenn der Berührungspunkt sich außerhalb dieses Elements bewegt hat.

Dieses Event wird auch gesendet, wenn sich die Werte der Radius-, Rotationswinkel- oder Kraft-Attribute eines Berührungspunkts ändern.

Hinweis: Die Häufigkeit, mit der touchmove-Events gesendet werden, ist browser-spezifisch und kann auch abhängig von der Leistungsfähigkeit der Hardware des Benutzers variieren. Sie sollten sich nicht auf eine spezifische Granularität dieser Events verlassen.

touchcancel

Wird gesendet, wenn ein Berührungspunkt auf irgendeine Weise unterbrochen wurde. Es gibt mehrere mögliche Gründe, warum dies passieren kann (und die genauen Gründe variieren von Gerät zu Gerät sowie von Browser zu Browser):

• Ein Verzögerungsereignis ist eingetreten, das die Berührung abgebrochen hat; dies kann passieren, wenn während der Interaktion eine modale Warnung erscheint.
• Der Berührungspunkt hat das Dokumentfenster verlassen und ist in den Benutzeroberflächenbereich des Browsers, ein Plug-in oder andere externe Inhalte gelangt.
• Der Benutzer hat mehr Berührungspunkte auf dem Bildschirm platziert, als unterstützt werden können, in diesem Fall wird die früheste Touch in der TouchList abgebrochen.

Verwendung mit addEventListener() und preventDefault()

Es ist wichtig zu beachten, dass in vielen Fällen sowohl Touch- als auch Maus-Events gesendet werden (um nicht-touch-spezifischem Code dennoch Interaktion mit dem Benutzer zu ermöglichen). Wenn Sie Touch-Events verwenden, sollten Sie preventDefault() aufrufen, um zu verhindern, dass das Maus-Event ebenfalls gesendet wird.

Die Ausnahme dazu ist Chrome, beginnend mit Version 56 (Desktop, Chrome für Android und Android Webview), wo der Standardwert für die passive-Option für touchstart und touchmove true ist und Aufrufe von preventDefault() keine Wirkung haben. Um dieses Verhalten zu überschreiben, müssen Sie die passive-Option auf false setzen, wonach der Aufruf von preventDefault() wie angegeben funktionieren wird. Die Änderung, Listener standardmäßig als passive zu behandeln, verhindert, dass der Listener das Rendering der Seite blockiert, während ein Benutzer scrollt. Eine Demo ist auf der Chrome Developer Website verfügbar.

Beispiel

Siehe das Beispiel im Hauptartikel zu Touch Events.

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Touch events
• GestureEvent