[JQUERY] 어떻게 DOM 요소의 모든 이벤트를 바인딩 할 수 있습니다?

어떻게 DOM 요소의 모든 이벤트를 바인딩 할 수 있습니다?

해결법

1. ---

   1.간단한 (하지만 정확한) 모든 이벤트를 테스트하는 방법이있다 :

   간단한 (하지만 정확한) 모든 이벤트를 테스트하는 방법이있다 :

   function getAllEvents(element) {
       var result = [];
       for (var key in element) {
           if (key.indexOf('on') === 0) {
               result.push(key.slice(2));
           }
       }
       return result.join(' ');
   }
   

   다음과 같은 모든 이벤트를 바인딩 :

   var el = $('#some-el');
   el.bind(getAllEvents(el[0]), function(e) {
       /* insert your code */
   });
   

2. ---

   2.또한 나는이 방법뿐만 아니라 생산을위한 외부 API를 관광하기에 좋은 생각, 각 이벤트를 잡으려고 jQuery.event.trigger를 다시 정의 할 수 있지만 :

   또한 나는이 방법뿐만 아니라 생산을위한 외부 API를 관광하기에 좋은 생각, 각 이벤트를 잡으려고 jQuery.event.trigger를 다시 정의 할 수 있지만 :

   var oldJQueryEventTrigger = jQuery.event.trigger;
   jQuery.event.trigger = function( event, data, elem, onlyHandlers ) { 
     console.log( event, data, elem, onlyHandlers ); 
     oldJQueryEventTrigger( event, data, elem, onlyHandlers ); 
   }
   

3. ---

   3.jQuery를 사용하면 사용중인 버전에 따라 목록을 추출하는 몇 가지 방법이있다,이 이벤트를 저장하는 방법을 변경했습니다. 나는 플러그인에서 "가장 최신 '버전의 캡슐화했지만, 기본적으로 당신이 원하는 :

   jQuery를 사용하면 사용중인 버전에 따라 목록을 추출하는 몇 가지 방법이있다,이 이벤트를 저장하는 방법을 변경했습니다. 나는 플러그인에서 "가장 최신 '버전의 캡슐화했지만, 기본적으로 당신이 원하는 :

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

   이것은 "기본"이벤트 (네임 스페이스)별로 그룹화 된 모든 바운드 이벤트의 중첩 된 목록을 제공합니다.

   그러나, 나는 당신이 모든 기본 jQuery를 이벤트를 원하는 실현 - 당신이 $ .event.special에서 그 중 일부를 가지고 $ .event를 검사 할 수 있지만, 허용 대답은 여전히 ​​당신의 최선의 방법이 될 수 있습니다. 또한 가능한 바인딩 기능과 같은 어떤 jQuery를 목록을 볼 수 있습니다.

4. ---

   4.당신은 동일한 기능 여러 이벤트를 바인딩 할 경우, 단순히 공백으로 구분합니다.

   당신은 동일한 기능 여러 이벤트를 바인딩 할 경우, 단순히 공백으로 구분합니다.

   $("#test").bind("blur focus focusin focusout load resize scroll unload click " +
       "dblclick mousedown mouseup mousemove mouseover mouseout mouseenter " + 
        "mouseleave change select submit keydown keypress keyup error", function(e){
       $("#r").empty().text(e.type);
   });
   

   jsfiddle에 대한 간단한 예

5. ---

   5.여기에 jQuery를위한 작은 확장입니다 :

   여기에 jQuery를위한 작은 확장입니다 :

   $.fn.onAny = function(cb){
     for(var k in this[0])
       if(k.search('on') === 0)
         this.on(k.slice(2), function(e){
           // Probably there's a better way to call a callback function with right context, $.proxy() ?
           cb.apply(this,[e]);
         });
     return this;
   };    
   

   용법:

   $('#foo').onAny(function(e){
     console.log(e.type);
   });  
   

   또한 당신은 (이 답변에서) 브라우저 콘솔을 사용할 수 있습니다 :

   monitorEvents($0, 'mouse'); // log all events of an inspected element
   monitorEvents(document.body); // log all events on the body
   monitorEvents(document.body, 'mouse'); // log mouse events on the body
   monitorEvents(document.body.querySelectorAll('input')); // log all events on inputs
   

6. ---

   6.(내가 jQuery를 어떤 와일드 카드 (어려움과 위험으로 가득 찬 것)을 지원합니다 생각하지 않지만, 표준 이벤트의 목록은 유한 비록 DOM2 이벤트 사양의 DOM2 HTML 사양 및 DOM3 이벤트에 걸쳐 슬프게도 비트 확산 사양), 당신은 항상 단순히 나열 할 수있다. jQuery를 사용하면, (공백으로 구분) 바인딩 예 : 여러 이벤트 이름을 부여 할 수 있도록 않습니다 :

   (내가 jQuery를 어떤 와일드 카드 (어려움과 위험으로 가득 찬 것)을 지원합니다 생각하지 않지만, 표준 이벤트의 목록은 유한 비록 DOM2 이벤트 사양의 DOM2 HTML 사양 및 DOM3 이벤트에 걸쳐 슬프게도 비트 확산 사양), 당신은 항상 단순히 나열 할 수있다. jQuery를 사용하면, (공백으로 구분) 바인딩 예 : 여러 이벤트 이름을 부여 할 수 있도록 않습니다 :

   $('#some-el').bind('click dblclick mouseover mouseout' /* etc.*/,function(e){
       console.log(e.type);
   });
   

7. ---

   7.나는 마크 콜먼의 스크립트를 촬영하고 내 요구를 위해 조금을 강화했다.

   나는 마크 콜먼의 스크립트를 촬영하고 내 요구를 위해 조금을 강화했다.

   난 당신과 공유하고 싶습니다 http://jsfiddle.net/msSy3/65/

   var lastEvent = null,
       countEvent = 0;
   $("#test").bind("blur focus focusin focusout load resize scroll unload click" + " dblclick mousedown mouseup mousemove mouseover mouseout mouseenter " + "mouseleave change select submit keydown keypress keyup error", function (e) {
       if (lastEvent !== e.type) {
           countEvent++;
           $("#r").prepend("<span>" + countEvent + ": " + e.type + "<br></span>");
           $("#r > span:nth-child(21)").remove();
           lastEvent = e.type;
       }
   });
   

from https://stackoverflow.com/questions/5848598/how-can-i-bind-all-events-on-a-dom-element by cc-by-sa and MIT license