인라인 onclick 핸들러를 사용하여 중첩된 요소에서 이벤트 전파를 방지하려면 어떻게 해야 합니까?

인라인 Onclick 속성으로 이벤트 전파 방지

여러 요소가 서로 중첩되고 자체 onclick 이벤트 핸들러가 있는 경우 다음이 가능합니다. DOM 계층 구조 위로 전파되는 이벤트로 상위 요소에 대한 핸들러를 트리거합니다. 이 동작은 어떤 경우에는 바람직할 수 있지만 다른 경우에는 이러한 전파를 방지해야 할 수도 있습니다.

예:

다음 코드 조각을 고려하세요.

<div onclick="alert('you clicked the header')" class="header">
  <span onclick="alert('you clicked inside the header');">something inside the header</span>
</div>

사용자가 범위를 클릭하면 범위의 onclick 이벤트 핸들러와 div의 onclick 이벤트 핸들러. 이벤트가 div로 전파되는 것을 방지하려면 다음 방법 중 하나를 사용할 수 있습니다.

1. event.stopPropagation()

이 메소드는 이벤트가 DOM 트리 위로 전파되는 것을 중지합니다.

<span onclick="event.stopPropagation(); alert('you clicked inside the header');">something inside the header</span>

2. window.event.cancelBubble(IE용)

Internet Explorer의 경우 동등한 방법은 window.event.cancelBubble입니다.

<span onclick="window.event.cancelBubble = true; alert('you clicked inside the header');">something inside the header</span>

위 내용은 인라인 onclick 핸들러를 사용하여 중첩된 요소에서 이벤트 전파를 방지하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!