브라우저가 터치 가능한지 여부 만 감지 할 수 있습니다. 실제로 터치 스크린이나 마우스가 연결되어 있는지 알 수있는 방법이 없습니다.

터치 기능이 감지되면 마우스 이벤트 대신 터치 이벤트를 수신하여 사용의 우선 순위를 지정할 수 있습니다.

터치 기능 크로스 브라우저를 감지하려면

function hasTouch() {
    return (('ontouchstart' in window) ||       // html5 browsers
            (navigator.maxTouchPoints > 0) ||   // future IE
            (navigator.msMaxTouchPoints > 0));  // current IE10
}

그런 다음 이것을 사용하여 확인할 수 있습니다.

if (!hasTouch()) alert('Sorry, need touch!);

또는들을 이벤트를 선택하십시오.

var eventName = hasTouch() ? 'touchend' : 'click';
someElement.addEventListener(eventName , handlerFunction, false);

또는 터치 대 비 터치에 대해 별도의 접근 방식을 사용하십시오.

if (hasTouch() === true) {
    someElement.addEventListener('touchend' , touchHandler, false);

} else {
    someElement.addEventListener('click' , mouseHandler, false);

}
function touchHandler(e) {
    /// stop event somehow
    e.stopPropagation();
    e.preventDefault();
    window.event.cancelBubble = true;
    // ...
    return false; // :-)
}
function mouseHandler(e) {
    // sorry, touch only - or - do something useful and non-restrictive for user
}

마우스의 경우 마우스 사용 여부를 감지 할 수 있습니다. 마우스가 사용법에 의해 감지되었음을 나타내는 전역 플래그를 설정할 수 있습니다 (기존 답변과 유사하지만 약간 단순화 됨).

var hasMouse = false;

window.onmousemove = function() {
    hasMouse = true;
}

(하나는 터치로 트리거 할 수 mouseup있거나 포함 할 수 없으므로 mousedown)

브라우저는 사용중인 시스템의 하드웨어 기능과 같은 기능을 감지하는 데 필요한 저수준 시스템 API에 대한 액세스를 제한합니다.

플러그인 / 확장 프로그램을 작성하여 액세스 할 수는 있지만 JavaScript 및 DOM을 통해 이러한 감지는이 목적으로 제한되며 다양한 OS 플랫폼에 맞는 플러그인을 작성해야합니다.

결론적으로, 이러한 탐지는 “좋은 추측”에 의해서만 추정 될 수 있습니다.

답변