1 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 | <!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <style> #box { width:300px; height:100px; background: red; text-align: right; } button { height: 100px; width:100px; } </style> </head> <body> <div id="box">더블클릭해봐요 <button>클릭</button> </div> <script src="./lib/jquery/1.9.1/jquery.min.js"></script> <script> // div과 button 이벤트가 겹쳐 있을때.. // div 더블클릭을 의도했는데.. // button 클릭시 까지 클릭과 더블클릭 이벤트가 모두 발생한다면??? $('#box').dblclick(function(e) { console.log(e.target.nodeName); console.log(e.target.tagName); console.log(e.type); // 더블클릭 이벤트 발생요소가 현재요소인지 체크 if(e.target == $(this).get(0)) { // $(e.target).is($(this)) console.log("box더블클릭"); } }); $('button').click(function(e) { console.log("버튼클릭"); }); </script> </body> </html> |
반응형
'jQuery' 카테고리의 다른 글
| [jQuery] add()메서드 - 확장집합에 다른 요소 추가, jquery 객체 합치기 (0) | 2015.02.04 |
|---|---|
| [jQuery] event.stopPropagation() - 부모태그로 이벤트 전파 중지 (0) | 2015.01.24 |
| [jQuery][사용자함수] $.fn.higherLayer - 확장집합에서 z-index가 가장 높은 요소 선택 (0) | 2015.01.06 |
| [jQuery] $.each, $.inArray - 배열 중복값 제거 함수 (0) | 2015.01.06 |
| [jQuery] not($(this)) - this가 아닌요소 선택 (0) | 2015.01.04 |
