Как проверить браузер для поддержки touchstart с помощью JS/jQuery?
В попытке следовать лучшим практикам мы пытаемся использовать соответствующие события JavaScript/jQuery в зависимости от того, какое устройство вы используете. Например, мы создаем мобильный сайт с тегом, который будет иметь событие onclick или touch. В случае с iPhone мы хотели бы использовать событие "touchstart". Мы хотим проверить, поддерживает ли их устройство "touchstart", прежде чем связывать этот обработчик с объектом. Если это не так, тогда мы свяжем "onclick".
Каков наилучший способ сделать это?
Ответы
Ответ 1
Вы можете определить, поддерживается ли событие:
if ('ontouchstart' in document.documentElement) {
//...
}
Посмотрите на эту статью:
Функция isEventSupported
, опубликованная там, действительно хороша при обнаружении широкого спектра событий, и это кросс-браузер.
Ответ 2
Используйте этот код, чтобы определить, поддерживает ли устройство сенсорное соединение.
Также работаем для Windows 8 IE10, который использует событие "MSPointerDown" вместо "touchmove"
var supportsTouch = false;
if ('ontouchstart' in window) {
//iOS & android
supportsTouch = true;
} else if(window.navigator.msPointerEnabled) {
//Win8
supportsTouch = true;
}
Ответ 3
Вы можете проверить, возвращается ли typeof document.body.ontouchstart == "undefined"
к нормальным событиям dom
Ответ 4
Я сделал полную демострацию, которая работает в каждом браузере с полным исходным кодом решения этой проблемы: Обнаружение устройств сенсорного экрана в Javascript.