Как проверить браузер на поддержку сенсорного запуска с помощью JS/jQuery?
В попытке следовать рекомендациям мы пытаемся использовать правильные события JavaScript/jQuery в соответствии с тем, какое устройство вы используете. Например, мы создаем мобильный сайт с тегом, который будет иметь событие onclick или touch. В случае iPhone мы хотели бы использовать событие "touchstart". Мы хотели бы проверить, поддерживает ли их устройство "touchstart", прежде чем связывать этот обработчик с объектом. Если этого не произойдет, мы свяжем "onclick".
Каков наилучший способ сделать это?
4 ответа
Вы можете определить, поддерживается ли событие:
if ('ontouchstart' in document.documentElement) {
//...
}
Посмотрите на эту статью:
isEventSupported
Функция, опубликованная там, действительно хороша для обнаружения самых разных событий, и она кросс-браузерная.
Используйте этот код, чтобы определить, поддерживает ли устройство касание.
Также работает для Windows 8 IE10, который использует событие "MSPointerDown" вместо "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;
}
}
Вы можете проверить, если typeof document.body.ontouchstart == "undefined"
вернуться к нормальным событиям
Я сделал полную демонстрацию, которая работает в каждом браузере с полным исходным кодом решения этой проблемы: Обнаружение устройств с сенсорным экраном в Javascript.