객체에 등록 된 이벤트 핸들러를 찾아야합니다.
예를 들면 다음과 같습니다.
$("#el").click(function() {...});
$("#el").mouseover(function() {...});
$("#el")한 클릭 하고 마우스 오버 등록.
그것을 알아 내고 이벤트 처리기를 반복 할 수있는 기능이 있습니까?
적절한 메소드를 통해 jQuery 객체에서 가능하지 않은 경우 일반 DOM 객체에서 가능합니까?
답변
jQuery 1.8부터는 이벤트 데이터를 “공용 API”에서 더 이상 사용할 수 없습니다. 이 jQuery 블로그 게시물을 읽으십시오 . 이제 이것을 대신 사용해야합니다.
jQuery._data( elem, "events" );elem jQuery 객체 또는 선택자가 아닌 HTML 요소 여야합니다.
내부 ‘비공개’구조이므로 수정해서는 안됩니다. 디버깅 목적으로 만 사용하십시오.
이전 버전의 jQuery에서는 다음과 같은 이전 방법을 사용해야합니다.
jQuery( elem ).data( "events" );답변
jQuery 1.8 이상에서 이벤트를 크롤링하여 다음과 같이 할 수 있습니다.
$.each($._data($("#id")[0], "events"), function(i, event) {
// i is the event type, like "click"
$.each(event, function(j, h) {
// h.handler is the function being called
});
});
다음은 연주 할 수있는 예입니다.
$(function() {
$("#el").click(function(){ alert("click"); });
$("#el").mouseover(function(){ alert("mouseover"); });
$.each($._data($("#el")[0], "events"), function(i, event) {
output(i);
$.each(event, function(j, h) {
output("- " + h.handler);
});
});
});
function output(text) {
$("#output").html(function(i, h) {
return h + text + "<br />";
});
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="el">Test</div>
<code>
<span id="output"></span>
</code>답변
jQuery 1.8 이상에서는 내부 데이터가 다른 객체에 배치되므로 더 이상 작동하지 않습니다.
최신 비공식 (그러나 이전 버전에서도 작동하지만 적어도 1.7.2에서는 작동) 방식은 다음과 같습니다.
$._data(element, "events")
밑줄 ( “_”)이 여기서 차이를 만듭니다. 내부적으로는 호출 중이며 $.data(element, name, null, true)마지막 (4 번째) 매개 변수는 내부 매개 변수 ( “pvt”)입니다.
답변
뻔뻔한 플러그,하지만 당신은 findHandlerJS 를 사용할 수 있습니다
그것을 사용하려면 findHandlersJS 를 포함 (또는 원시 자바 스크립트 코드 를 크롬의 콘솔 창에 복사하여 붙여 넣기 )하고 관심있는 요소의 이벤트 유형과 jquery 선택기를 지정해야합니다.
예를 들어, 언급 한 이벤트 핸들러를 신속하게 찾을 수 있습니다.
findEventHandlers("click", "#el")
findEventHandlers("mouseover", "#el")
이것이 반환되는 것입니다 :
- element
이벤트 핸들러가 등록 된 실제 요소 - events
우리가 관심있는 이벤트 유형에 대한 jquery 이벤트 핸들러에 대한 정보가있는 배열 (예 : 클릭, 변경 등)- handler
마우스 오른쪽 단추로 클릭하고 함수 정의 표시를 선택하여 볼 수있는 실제 이벤트 핸들러 메소드 - 선택기
위임 된 이벤트에 제공되는 선택기. 직접 이벤트의 경우 비어 있습니다. - targets
이 이벤트 핸들러가 대상으로하는 요소와 함께 나열하십시오. 예를 들어, 문서 객체에 등록되어 페이지의 모든 버튼을 대상으로하는 위임 된 이벤트 핸들러의 경우이 속성은 페이지의 모든 버튼을 나열합니다. 마우스를 가져 가서 크롬으로 강조 표시된 것을 볼 수 있습니다.
- handler
답변
답변
@jps에서 하나의 함수로 두 솔루션을 결합했습니다.
jQuery.fn.getEvents = function() {
if (typeof(jQuery._data) === 'function') {
return jQuery._data(this.get(0), 'events') || {};
}
// jQuery version < 1.7.?
if (typeof(this.data) === 'function') {
return this.data('events') || {};
}
return {};
};그러나이 함수는 jQuery 자체를 사용하여 설정된 이벤트 만 반환 할 수 있습니다.
답변
1.9부터 Migrate 플러그인을 사용하여 이전 동작을 복원하는 것 외에는 이벤트를 검색하는 문서화 된 방법이 없습니다. jps에서 언급했듯이 _.data () 메소드를 사용할 수 있지만 내부 메소드입니다. 이 기능이 필요한 경우 올바른 작업을 수행하고 마이그레이션 플러그인을 사용하십시오.
의 jQuery 문서에서 .data("events")
1.9 이전에는 다른 코드에서 “events”라는 데이터 요소를 정의하지 않은 경우 .data ( “events”)를 사용하여 요소에 대한 jQuery의 문서화되지 않은 내부 이벤트 데이터 구조를 검색 할 수있었습니다. 이 특별한 경우는 1.9에서 제거되었습니다. 이 내부 데이터 구조를 검색 할 공용 인터페이스가 없으며 문서화되지 않은 상태로 유지됩니다. 그러나 jQuery Migrate 플러그인은 종속 된 코드에 대해이 동작을 복원합니다.
