하위 앵커 클릭이 상위 클릭 이벤트를 트리거하는 것을 방지하는 방법은 무엇입니까?

하위 앵커 클릭 이벤트가 상위 클릭 이벤트를 트리거하는 것을 방지

코드에서 볼 수 있듯이 상위 div 내에서 하위 앵커 요소를 클릭하면 onclick 이벤트가 있으면 두 이벤트가 모두 실행됩니다. 이 문제를 해결하고 상위 클릭 이벤트가 실행되는 것을 방지하려면 다음 두 가지 옵션이 있습니다.

옵션 1: 이벤트 원본 확인

jQuery에서 전달된 eventargs 객체 검사 , 클릭을 시작한 요소를 확인할 수 있습니다.

$("#clickable").click(function(e) {
    if($(e.target).is("div")) {
        window.location = url;
        return true;
    }
});

sender 요소가 div 자체가 아닌 경우 div의 onclick 핸들러는 트리거되지 않습니다.

옵션 2: 이벤트 버블링 중지

또는 stopPropagation을 사용하여 클릭 이벤트가 상위 이벤트로 버블링되는 것을 방지할 수 있습니다. () 하위 앵커 메서드:

$("#clickable a").click(function(e) {
    // Custom anchor handler
    e.stopPropagation();
});

이 메서드는 이벤트가 발생하는 것을 방지합니다. 앵커 클릭 이벤트만 실행되도록 상위 div에 전파됩니다.

위 내용은 하위 앵커 클릭이 상위 클릭 이벤트를 트리거하는 것을 방지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!