Wie Browser für Touchstart-Unterstützung mit JS/jQuery überprüfen?

Question

In dem Bemühen, den Best Practices zu folgen, versuchen wir, die richtigen JavaScript/jQuery-Ereignisse entsprechend dem von Ihnen verwendeten Gerät zu verwenden. Beispielsweise erstellen wir eine mobile Website mit einem Tag, auf dem ein OnClick- oder Touch-Ereignis angezeigt wird. Im Fall eines iPhone möchten wir das Ereignis "touchstart" verwenden. Wir möchten testen, ob ihr Gerät "Touchstart" unterstützt, bevor wir diesen Handler an das Objekt binden. Wenn nicht, werden wir stattdessen "onclick" binden.

Was ist der beste Weg, dies zu tun?

Answer 1

Sie erkennen können, ob das Ereignis wird unterstützt durch:

if ('ontouchstart' in document.documentElement) { 
    //... 
} 

Geben Sie einen Blick auf diesen Artikel:

• Detecting event support without browser sniffing

Die isEventSupported Funktion dort veröffentlicht wurde, ist wirklich gut bei der Erkennung einer Vielzahl von Ereignissen, und es ist Cross-Browser.

Answer 2

könnten Sie überprüfen, ob typeof document.body.ontouchstart == "undefined" normal dom Ereignisse fallen zurück

Answer 3

ich eine volle demostration gemacht, die mit dem vollständigen Quellcode der Lösung dieses Problems in jedem Browser funktioniert: Detect touch screen devices in Javascript.

Answer 4

Verwenden Sie diesen Code, um zu erkennen, ob das Gerät Berührung unterstützt.

auch arbeiten für Windows 8 IE10 die Veranstaltung ‚MSPointerDown‘ verwendet anstelle von ‚Berührungsbewegungs‘

var supportsTouch = false; 
if ('ontouchstart' in window) { 
    //iOS & android 
    supportsTouch = true; 

} else if(window.navigator.msPointerEnabled) { 

    // Windows 
    // To test for touch capable hardware 
    if(navigator.msMaxTouchPoints) { 
     supportsTouch = true; 
    } 

}