2016-08-14 3 views
0

이 Meteor 클라이언트 템플리트 이벤트는 화면에서 클릭하는 위치에 따라 2 ~ 23 번 여러 번 실행됩니다.
왜, 어떻게 고쳐야합니까? 여기 클릭 이벤트가 여러 번 발동합니다.

Template.myT.events({ 
     'click *:not(canvas)': function(e) { 
     console.log(e.target); 
     return; 
     }); 

콘솔

enter image description here

답변

0

당신은 캔버스 요소를 제외한 모든 요소에 클릭 리스너를 등록에서 출력됩니다. <p> 요소 안에 <span> 요소를 클릭하면 <span> 요소뿐만 아니라 <p> 요소를 클릭 할 수 있습니다. 이것은 클릭 수신기가 여러 번 호출되는 이유입니다 (이벤트가 전달됨). 이러한 동작을 방지하려면 클릭 핸들러에 e.stopPropagation()을 사용하십시오.

+0

조상 HTML 요소에 다른 핸들러가 설정되면 어떨까요? 'e.stopPropagation()'은 그것을 멈출 것이고 아마도 여러분이 원하는 것이 아닙니다. 더 좋은 대답 (imo)은 처음부터 많은 요소들에 핸들러를 설정하지 않는 것입니다. ''* : not (canvas) ''는별로 구체적이지 않습니다. 아마도'id' 또는'class' 속성을 사용해야합니다. –

+0

@DavidKnipe 코드가 캔버스 외부에서 클릭 이벤트를 캡처해야합니다. 어떻게'id' 또는'class'를 사용하여 해결할 것을 제안합니까? –

+0

@FredJ., body 요소의 click 이벤트를 수신 한 다음'e.target == theCanvasElement'를 확인하십시오. –

관련 문제