이벤트 리스너 내에서 jQuery 바인딩 이벤트

Question

클릭 이벤트 리스너가 바인딩 된 링크가 있습니다. 클릭 할 때 클릭 이벤트 리스너가 문서에 첨부됩니다.이 때 이벤트는 쉽게 제거 할 수 있도록 네임 스페이스로 표시됩니다. 두 번째 이벤트를 연결하면 즉시 시작됩니다. 왜 이런 일이 발생합니까? 내 생각 엔 새 이벤트가 문서에 첨부 될 때 이벤트가 여전히 dom 트리 위로 버블 링되고 있다는 것입니다. 이 때문에 두 이벤트를 모두 트리거합니다. JSFiddle을 참조하십시오.

HTML

<a href="#" id="example">Click Me</a> 

자바 스크립트

$('#example').on('click', function(e) { 
    $(document).on('click.example', function(e) { 
     alert('example event triggered'); 
    }); 
}); 

내가 달성하기 위해 시도하고 그것이 내가 DOM 요소를 삽입 버튼을 클릭에 있습니다. 삽입 될 때 삽입 된 요소 외부에서 클릭 이벤트가 발생했는지 감지하기 위해 트리거 될 때 이벤트 대상을 검사하는 문서에 이벤트 수신기를 첨부하려고합니다. 대상이 그 안에 있으면 아무 것도 수행하지 않아야합니다. 대상이 요소 외부에 있으면 요소를 숨겨야합니다.

Answer 1

이 때문에 이벤트 전파이다

$('#example').on('click', function(e) { 
 
    $(document).on('click.example', function(e) { 
 
    alert('example event triggered'); 
 
    }); 
 
    e.stopPropagation(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a href="#" id="example">Click Me</a>

당신은 이벤트가 anchor 요소에 여전히 때 핸들러를 등록하고 이벤트가있는 문서 객체에 바인딩 현재 요소의 조상. 이제 이벤트가 전파되어 document 오브젝트에 도달하면 클릭 핸들러가 바인딩 된 것을 발견하고 트리거합니다.

참고 : 당신은이 어떻게 든 당신이 "CSTE 연구진은 $ (문서)"는 바인딩됩니다 # 예제에 모든 클릭에