e.preventDefault()가 방탄하지 않습니까?

Question

비슷한 질문을했지만 실제 만족할만한 대답을 얻지 못했기 때문에 여기서 다시 시도 할 것입니다. 나는 다음과 같은 코드를 사용하는 경우 :

$("#element") .on('click', function() { 
        // do something 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
       }); 

을 나는 해고하지 않았다 클릭 이벤트가 (때문에 브라우저가 이벤트를 통해 작동합니다있는 계층의) 결코 것을 기대하고 있지만, 사실 난의 말을 할 수있는 요소를 터치하면 클릭 이벤트가 한 번 발생하는 것보다 20 번. 왜?

그리고 나는 또한 같은 것들을 시도 : 조금 더 단단한하지만 방탄 것 같았다

$("#element") .on('click', function() { 
        // do something 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        e.stopPropagation(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false; 
       }); 

합니다. 작동하는 것 같다하지만, 지독하게 바보

$("#element") .on('click', function() { 
        if (!touchdevice) { 
         // do something 
        }; 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        e.stopPropagation(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false; 
       }); 

, 그것은되지 않습니다 : 그래서 내가해야 할 일을했을? 아이디어가있는 사람은 누구입니까? 감사!

편집 :

var touched; 
$("#element") .on('click', function() { 
        if (!touched) { 
         // do something 
        }; 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); // actual senseless here 
        e.stopPropagation(); // actual senseless here 
        touched = true; 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false;  // actual senseless here 
       }); 

이들 어서 : 그래서 난 정말 그런 짓을했다! 클릭 이벤트가 터치 감각적 인 브라우저와 일반 브라우저 (또는 새롭게 결합 된 브라우저)를 모두 처리 할 수 ​​있도록 두 번 실행되지 않도록 동일한 요소에서 터치 시작 및 클릭 이벤트를 사용하는 것이 안전하고 일반적인 방법이어야합니다. 어떻게 할 건데?

Answer 1

내가 해고하지 않았다 클릭 이벤트가 (때문에 브라우저가 이벤트를 통해 작동합니다있는 계층의) 결코 것을 기대하고 있습니다 [...]

당신은 even.preventDefault()의 잘못된 기대를 가지고있다.

event.preventDefault()은 브라우저가 해당 요소/이벤트 조합에 대해 수행하는 기본 작업을 방지합니다. 예 : 양식 제출 또는 링크 따라 가기. 은이 아니기 때문에 다른 이벤트 처리기가 실행되지 않습니다.

e.stopPropagation()은 이벤트가 버블 링되는 것을 방지하여 조상에 추가 된 이벤트 핸들러가 실행되지 않도록합니다.

---

그러나, 당신은이 작업을 수행 할 수있는 권리 방법이 실제로 그렇게 플래그를 설정, 실행하는 다른 이벤트의 핸들러를 방지하기 위해 이러한 방법을 보인다 사용할 수 없습니다.

Answer 2

지금 내가 아주 좋은하고 안정적인 작동 내 사이트에 대부분의 장소에 다음 코드를 사용하고 : 내 발명하지

var flag = false; 
$("#element").on('touchstart click', function() { 
    if (!flag) { 
     flag = true; 
     setTimeout(function() { 
      flag = false; 
     }, 100); // someone else recommended 300 here but I use this value 

     // action here 

    };     
    return false; 
}); 

PS,하지만 약간의 시간이 경과 때문에 불행히도 나는 소스를 잊었다 .