Jak sprawdzić obsługę touchstart w przeglądarce za pomocą JS / jQuery?

Aby postępować zgodnie z najlepszymi praktykami, staramy się używać odpowiednich zdarzeń JavaScript / jQuery w zależności od tego, jakiego urządzenia używasz. Na przykład tworzymy witrynę mobilną z tagiem, który będzie zawierał Zdarzenie onclick lub touch. W przypadku iPhone 'a chcielibyśmy użyć zdarzenia "touchstart". Chcielibyśmy sprawdzić, czy ich urządzenie obsługuje "touchstart", zanim powiązamy tę funkcję obsługi z obiektem. Jeśli nie, to będziemy wiązać "onclick" zamiast.

Jaki jest najlepszy sposób na zrobić to?

Author: Alex, 2010-05-26

4 answers

Możesz wykryć, czy zdarzenie jest obsługiwane przez:

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

Spójrz na ten artykuł:

Opublikowana tam funkcja isEventSupported jest naprawdę dobra w wykrywaniu wielu różnych zdarzeń i jest między przeglądarkami.

 85
Author: CMS,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-16 20:56:31

Użyj tego kodu, aby wykryć, czy urządzenie obsługuje dotyk.

Działa również w systemie Windows 8 IE10, który używa zdarzenia "MSPointerDown" zamiast "touchmove"

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;
    }

}
 11
Author: George Filippakos,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-02-19 07:27:31

Możesz sprawdzić, czy typeof document.body.ontouchstart == "undefined" powróci do normalnych zdarzeń dom

 3
Author: antimatter15,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-05-26 19:05:57

Zrobiłem pełną demostrację, która działa w każdej przeglądarce z pełnym kodem źródłowym rozwiązania tego problemu: Detect touch screen devices in Javascript .

 1
Author: Manuel Ignacio López Quintero,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-05-12 03:09:34