iPad의 HTML5 동영상 요소가 onclick을 실행하지 않습니까?

Question

내 HTML에서 video 요소를 다음과 같이 사용하고 있습니다.

<div id="container" style="background:black; overflow:hidden;width:320px;height:240px"> 
<video style="background:black;display:block" id="vdo" height="240px" width="320px" src="http://mydomain/vid.mp4"></video></div>

자바 스크립트에서이 작업을 수행하고 있습니다.

var video=document.getElementById('vdo'); 
var container=document.getElementById('container'); 
video.addEventListener('click', function(e) { 
    e.preventDefault(); 
    console.log("clicked"); 
}, false); 
container.addEventListener('click', function(e) { 
    e.preventDefault(); 
    console.log("clicked"); 
}, false);

데스크톱 사파리/크롬에서 모든 것이 정상적으로 작동합니다. 나는 콘솔에서 2 개의 "클릭 된"것을 볼 수 있습니다. 하지만 ipad에는 아무것도 없습니다. 먼저 iOS 버전 3.2를 사용해 보았습니다. 그런 다음 아무런 성공없이 4.2.1 최신 버전으로 업데이트했습니다.
비슷한 질문을 찾았습니다. HTML5 Video Element on iPad doesn't fire onclick or touchstart events? 비디오 태그에 컨트롤을 사용하지 말 것을 제안했지만 사용하지 않았습니다.

Answer 1

현재 해당 이벤트와 간섭하는 다른 클릭이없는 것으로 확인 했습니까? 내가 한 것은 새 리스너를 추가하기 전에 먼저 특정 이벤트에 바인딩을 해제하는 것입니다.

예 :

video.unbind("click").click(function(){...} 

은 내가 가지고 있던 문제를 해결하기 위해이를 발견했다.

Answer 2

Frederico에서 제안한대로 바인딩 해제/클릭을 시도했지만 클릭 이벤트가 발생하지 않았습니다. 그러나 나는 터치 스타트하고 이벤트를 touchend OK. (실제로 div의 한 레벨에서 DOM에서 가져 오는 것입니다. 그러나 비디오 요소에서 가져온 것뿐입니다.)

Answer 3

매우 늦은 답변이지만, . 이벤트를 "터치 스타트"로 변경하면 효과가 있습니다.

video.addEventListener('touchstart', function(e) { 

이 동작은 일종의 무작위로 보입니다. 왜냐하면 클릭이 대부분 작동하기 때문입니다. 나는 왜 그리고 언제 정확하게 보지 않았다.