development

이벤트 핸들러가 jQuery의 요소에 바인딩되어 있는지 테스트

big-blog 2020. 5. 13. 20:44
반응형

이벤트 핸들러가 jQuery의 요소에 바인딩되어 있는지 테스트


이 질문에는 이미 답변이 있습니다.

요소에 클릭 핸들러, 변경 핸들러 또는 jQuery를 사용하여 바인딩 된 모든 종류의 이벤트 핸들러가 있는지 여부를 판별 할 수 있습니까?또한 주어진 유형의 이벤트에 대해 얼마나 많은 클릭 핸들러 (또는 어떤 종류의 이벤트 핸들러)가 있는지, 그리고 이벤트 핸들러에 어떤 기능이 있는지 확인할 수 있습니까?


데이터 캐시에서이 정보를 얻을 수 있습니다.예를 들어, 콘솔에 로그를 기록하십시오 (firebug, ie8).

console.dir( $('#someElementId').data('events') );

또는 그들을 반복 :

jQuery.each($('#someElementId').data('events'), function(i, event){

    jQuery.each(event, function(i, handler){

        console.log( handler.toString() );

    });

});

또 다른 방법은 다음

북마크를

사용할 수 있지만 분명히 런타임에는 도움이되지 않습니다.


바인딩이 아직 없을 때 바인딩을 제거하는 것이 가장 좋은 해결책은 아니지만 충분히 효과적입니다! 두 번째로 '클릭'하면 중복 바인딩이 생성되지 않음을 확실하게 알 수 있습니다.따라서 다음과 같이 die () 또는 unbind ()를 사용합니다.

$("#someid").die("click").live("click",function(){...

또는

$("#someid").unbind("click").bind("click",function(){...

또는 최신 jQuery 버전에서 :

$("#someid").off("click").on("click",function(){...

나는 정확히 그렇게하는 hasEventListener라는 플러그인을 작성했습니다.

http://github.com/sebastien-p/jquery.hasEventListener

도움이 되었기를 바랍니다.


이 솔루션은 jQuery 1.8부터 블로그에서 읽을 수 있으므로 더 이상 지원되지 않습니다.

$ (element) .data ( "events") : 이제 1.8에서 제거되었지만 $ ._ data (element, "events")를 통해 디버깅 목적으로 이벤트 데이터를 얻을 수 있습니다.

이 인터페이스는 지원되는 공용 인터페이스가 아닙니다. 실제 데이터 구조는 버전마다 호환되지 않을 수 있습니다.

따라서 바인딩을 해제 / 리 바인드하거나 단순히 부울을 사용하여 이벤트가 첨부되었는지 여부를 결정해야합니다 (제 생각에 가장 좋은 해결책입니다).


jQuery 1.9로 업데이트되었을 수도 있습니다. *나는 이것이 현재 나를 위해 유일하게 작동하는 것을 발견하고있다 :

$._data($("#yourElementID")[0]).events

"once"라는 매우 작은 플러그인을 작성했습니다.

$.fn.once = function(a, b) {
    return this.each(function() {
        $(this).off(a).on(a,b);
    });
};

그리고 간단히 :

$(element).once('click', function(){
});

jQuery 1.9 이상

var eventListeners = $._data($('.classname')[0], "events");

 

[0]

배열 리터럴이 필요했습니다 .


언급 된 hasEventListener 플러그인이 사용자 정의 이벤트를 처리한다고 생각하지 않습니다.

var obj = {id:'test'};
$(obj).bind('custom', function(){
    alert('custom');
}).trigger('custom');

alert($(obj).hasEventListener('custom'));

또한 적어도 jQuery 1.5에서는 위와 같이 객체에 바인딩 된 이벤트에 대해 다르게 반환하기 때문에 $ (target) .data ( 'events') 사용에주의해야한다고 생각합니다. 다음과 같은 작업을 수행해야합니다.

var events = $(target).data("events");
if(typeof events === "function"){
   events = events.events;
}

I am using this sort of approach and it works but it feels a bit like I am at the mercy of jquery internals and that really I shouldn't be doing it!


I had the same need & quickly patched an existing code to be able to do something like this:

 if( $('.scroll').hasHandlers('mouseout') )  // could be click, or '*'...
 { 
   ... code ..
 }

It works for event delegation too:

 if ( $('#main').hasHandlers('click','.simple-search') )  ...

It is available here : jquery-handler-toolkit.js


With reference to SJG's answer and from W3Schools.com

As of jQuery version 1.7, the off() method is the new replacement for the unbind(), die() and undelegate() methods. This method brings a lot of consistency to the API, and we recommend that you use this method, as it simplifies the jQuery code base.

This gives:

$("#someid").off("click").live("click",function(){...

or

$("#someid").off("click").bind("click",function(){...

This works for me: $('#profile1').attr('onclick')

참고URL : https://stackoverflow.com/questions/1236067/test-if-event-handler-is-bound-to-an-element-in-jquery

반응형