2013-05-27 1 views
3

다른 개발자가 이전에이 문제를 겪었습니다.큰 프로젝트 전체에서 HTML 클릭 패턴으로 닫습니다.

$('#elm').on('click',function($e){ 
    $e.stopPropagation(); 
    //... do stuff (i.e. Open something); 
}); 

$('html').on('click',function($e){ 
    //... do oposite of stuff (i.e. Close something); 
} 

우리의 문제는 모든 인 stopPropagation의 사이트에서 다른 구성 요소의 폐쇄를 중지하는 것입니다 : 우리는이 패턴 다음과 같은 많은 구성 요소와 함께 큰 코드베이스가 있습니다. 우리가 정말로 원하는 것은이 컴포넌트의 클릭 핸들러를 차단하는 메커니즘이지만 다른 컴포넌트는 클릭 핸들러를 차단하지 않는 메커니즘입니다.

지금 우리 버그를 수정하고 향후 멀티 개발자 팀이 따라야 할 가장 쉬운 솔루션을 찾고 있습니다. 그들은 문서의 상단에 전파 일단

+0

+1 정말 좋은 아이디어입니다. – pattyd

+1

'$ e.preventDefault();'(http://api.jquery.com/event.preventDefault/)는 필요한 것을할까요? –

+0

불행하게도 브라우저가 일반적으로 취하는 기본 동작 만 중지합니다. 내가 필요한 것은 원래이 요소가 아닌 HTML 요소의 클릭을 감지하는 것입니다. 나는 플러그인을 작성했다 : https://github.com/krismeister/jQuery.notMyEvent 그러나 나는 여전히 사람들이 어떤 기법을 추천하는지에 관심이있다. – LessQuesar

답변

1

.live() 방법은이 .live() 방법은 핸들러를 결합 때문에 당신이 해킹 할이 활용할 수 있도록 라이브 이벤트를 사용하여 전파를 중지 가능한 이벤트를하지 않는 처리 $(document)으로 이동하고 event.target 속성을 사용하여 계층 구조의 맨 위에서 이벤트를 트리거 한 요소를 식별합니다.

stopPropagation은 전파가 DOM 계층 구조 위로 버블 링하는 것을 중지하지만 처리기가 문서 수준에 있기 때문에 전파 할 상위 위치가 없습니다.

한편, .delegate()이 처리하는 이벤트는 바인드 된 요소에 버블 링됩니다. 위임 된 이벤트 핸들러가이라고 불릴 때까지 DOM 트리 아래의 모든 요소에 바인딩 된 이벤트 핸들러가 이미 실행되었을 것입니다. 정확히 무엇을하는 방법에 http://jsfiddle.net/knr3v/2/

따라서 대신 클릭, 바인딩의 livedelegate 방법을 사용할 수 있습니다 :이 핸들러는, 그러므로,이 예제를 참조하십시오 event.stopPropagation()

를 호출하여 트리거에서 위임 된 핸들러를 방지 할 수 너는 설명하고있다.

+0

이 솔루션의 이벤트 단계를 잘 이해했습니다. $ .live는 jquery 1.9에서 제거되었지만 잘 작동합니다. http://jsfiddle.net/VmHpA/ 감사합니다. – LessQuesar