데스크톱 브라우저는 터치 이벤트를 지원합니까?

Question

ontouchstart 및 ontouchmove과 같은 터치 이벤트와 <canvas>을 사용하여 매우 간단한 그리기 앱을 프로토 타이핑하여 HTML5의 속도를 높이려고합니다.

터치 이벤트를 시뮬레이트하기 위해 마우스 클릭을 사용하는 Android 에뮬레이터에서 잘 표시되고 제대로 작동합니다. 그러나 내 데스크톱 브라우저 (Safari 5.1.1, Windows의 Firefox 7)에서 실행 중일 때는 전혀 작동하지 않습니다.

마우스 클릭 이벤트가 에뮬레이터 내에서 실행될 때처럼 터치 이벤트로 해석 될 것이라고 생각했습니다.

데스크톱 브라우저가 단순히 터치 이벤트를 지원하지 않는지 궁금합니다.

Answer 1

파이어 폭스 6, 터치 이벤트를 지원합니다. 호환성 표 here을 참조하십시오.

MDN article on Touch Events

편집 : 당신은 터치 스크린 또는 마우스를 테스트하고 있습니까? 마우스 이벤트는 자동으로 터치 이벤트로 변환되지 않습니다. 마우스로 터치 이벤트를 시뮬레이트하는 방법은 this post을 참조하십시오.

Answer 2

ontouchstart 자바 스크립트 용 웹툰 iphone 버전에 추가됩니다. 당신은 에뮬레이터에서만 테스트 할 수 있습니다.

Answer 3

실제로는 다른 방향입니다. 모바일 브라우저는 레거시 지원을 위해 터치를 마우스 이벤트로 변환합니다. 모바일 및 데스크톱 모두에서 작동해야하고 터치 이벤트가 실제로 필요하지 않은 경우 대신 마우스 이벤트 만 사용할 수 있습니다. 그렇지 않으면 터치 이벤트와 마우스 이벤트를 바인딩하고 터치 이벤트로 인해 마우스 이벤트가 취소됩니다. 모바일 장치에서 이러한 방식으로 터치 발생 및 마우스 작동은 발생하지 않습니다. 바탕 화면에서 터치가 발생하지 않고 마우스가 움직입니다.

필라우의 경우 휴대 기기에서 클릭 이벤트를 취소하는 간단한 예가 있습니다. 클릭 끌기가 필요한 그림 그리기에 대한 자세한 내용은 탐지를 위해 더 많은 코드가 필요하지만 기본적인 아이디어는 처리해야하는 이벤트를 묶는 것과 같습니다. 그런 다음 e.preventdefault()은 모바일 브라우저가 클릭 유형 이벤트를 에뮬레이트하지 못하도록합니다. 위의

$('#element').on('touchend click', function(e){ 

    // Do your onclick action now 

    // cancel the onclick firing 
    e.preventDefault(); 
});