stopPropagation이 'this'를 사용하는 대신 콜백에서 이벤트 매개 변수를 사용하는 이유는 무엇입니까?

Question

stopPropagation() 또는 stopDefault()을 jQuery와 함께 사용하는 이유를 이해할 수 없으므로 이벤트 핸들러 함수에서 콜백에 param을 도입해야합니다. 브라우저는 그 기능에 무엇을 전달해야하는지 어떻게 알 수 있습니까? 또한 this을 사용하지 않는 이유는 무엇입니까?

다음은 작동하는 코드입니다. 내가 굵게/혼란 부분을 별표로 표시했습니다 :

$(document).ready(function() { 
    $(".see-photos").on("click", function(**event**) { 
    event.stopPropagation(); 
    $(this).closest(".tour").find(".photos").slideToggle(); 
    }); 
    $(".tour").on("click", function() { 
    alert("This should not be called"); 
    }); 
}); 

나에게이 방법은 더 의미가 있습니다. 핸들러 함수에는 콜백에 대해 event 매개 변수가 없습니다. jQuerys' .on() 기능은 이벤트가 this으로 발사 된 요소가 아닌 이벤트 자체를 전달하기 때문에입니다

$(document).ready(function() { 
    $(".see-photos").on("click", function() { 
    $(this).stopPropagation(); 
    $(this).closest(".tour").find(".photos").slideToggle(); 
    }); 
    $(".tour").on("click", function() { 
    alert("This should not be called"); 
    }); 
}); 

Answer 1

.

다음을 수행하려고하면 : 당신은 당신의 콘솔에서 클릭당한 <a> 태그를 볼 수

$('a').on('click', function() { 
    console.log(this); 
}); 

. 이것은 DOM click 이벤트와 jQuery 모두에 적용됩니다. 또한 event.target에서이 <a> 태그를 볼 수 있습니다 *

당신이 이벤트에 대한 정보를 원하는 경우 귀하의 질문에 그렇게했듯이, 당신은 당신의 기능에 주입해야합니다.

$('a').on('click', function (event) { 
    console.log(event); 
}); 

이를 모든 이벤트 정보는 event에 있습니다. 마찬가지로 요소가 전파되지 않으므로 자체를 번 전파하는 것을 중지하는 것은 논리적 일뿐입니다.

That being said, this and event.target are not the same