[jQuery] $._data($("selecter")[0], 'events' ) - has a event 이벤트를 가지고 있는지 체크
jQuery 2016. 3. 7. 14:551 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | <!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <script src="js/jquery.js"></script> </head> <body> <button id="btn">이벤트버튼</button> <button id="on">on</button> <button id="off">off</button> <script> var foo = function() { alert("foo"); } var bar = function() { alert("bar"); } // hasEventListener // has a event 이벤트를 가지고 있는지 체크 // 하나의 요소에 같은 이벤트가 여러개 bind 될 수 있다. // 여러번 bind 하는 목적이 아니라면 이벤트를 걸기전 해당 이벤트의 존재 유무를 판단하고 bind하자 // $._data($("selecter")[0], 'events' ) // ($._data($("selecter")[0],'events')).hasOwnProperty("이벤트명") // has a event 체크 $("#on").click(function(event) { $("#btn").on("click.foo", foo); $("#btn").on("click.bar", bar); // jQuery 1.8버전 이전 형식 // console.log($('#btn').data('events')); // jquery 1.8버전 이후부터는 다음과같이 사용가능 console.log($._data($("#btn")[0], 'events' )); //#btn 요소에 event를 확인 }); $("#off").click(function(event) { // $("#btn").off("click", foo); // 이벤트 핸들러로 구분 $("#btn").off(".foo"); // namespace로 구분 console.log($._data($("#btn")[0], 'events' )); }); // jQueryUI 이벤트 체크활용 !!!! // 요소에 이벤트를 걸때 속성으로 이벤트 이름을 class로 넣어주어 다음과 같이 체크 또는 선택으로 응용 $('.popup').is('.ui-draggable'); // ui-draggable 이벤트가 걸려있니?? $('.popup:not(.ui-draggable)').draggable(); // ui-draggable이벤트가 걸려있지 않은 요소들 선택 </script> </body> </html> |
반응형
'jQuery' 카테고리의 다른 글
[jQuery] $.trim() - 문자열 앞 뒤 공백제거 (2) | 2016.03.09 |
---|---|
[jQuery] html5 data 속성 제어 - data() 메서드 활용 (0) | 2016.03.08 |
[jQuery] slice() - start, end 까지 index 요소 선택 between (0) | 2016.03.07 |
[jQuery] 페이징 스크롤 (0) | 2016.03.07 |
[jQuery] event.data trigger - 이벤트 데이터 전달 (0) | 2016.03.03 |