mousedown и mouseup срабатывает на сенсорных устройствах

Question

Просто любопытно о цели mousedown и mouseup событий, так как они запускаются также на сенсорных устройствах. Я думал, что mousedown и touchstart являются взаимоисключающими (первый работает на настольном компьютере, а второй на сенсорных устройствах) и то же самое для mouseup и touchend, но, похоже, это не так. Полное сенсорное событие запускает все вышеперечисленные события: протестировано на Safari и Chrome. Таким образом, чтобы провести различие между событием щелчка (мыши) и событием щелчка (касания), мне нужно использовать какую-то функцию, которая сообщает мне, является ли это сенсорным устройством или нет:

    function isTouchDevice() {
        return 'ontouchstart' in window        // works on most browsers
            || navigator.maxTouchPoints;       // works on IE10/11 and Surface
    }

    myElem.addEventListener("mousedown", () => {
        if (isTouchDevice()) return;
        // do something
    }, false);

    myElem.addEventListener("mouseup", () => {
        if (isTouchDevice()) return;
        // do something
    }, false);

    myElem.addEventListener("touchstart", () => {
        // do something
    }, false);

    myElem.addEventListener("touchend", () => {
        // do something
    }, false);

Мне действительно нужно проверять, является ли устройство сенсорным или нет, чтобы различать щелчки мышью и касания?

Answer 1

Нет, вы не должны и, вероятно, не должны пытаться проверить, является ли устройство сенсорным экраном или нет. Если вы хотите остановить запуск других событий, вы можете использовать метод protectDefault.

myElem.addEventListener("touchstart", (event) => {
   event.preventDefault(); 
   // do something
}, false);

Если вы хотите получить более подробную информацию, вы должны прочитать эту статью: Touch and Mouse