jQuery Event Attachment


/ Published in: JavaScript
Save to your folder(s)

다양한 형태로 jQuery를 이용하여 DOM 요소에 이벤트를 다는 방법


Copy this code and paste it in your HTML
  1. //The method attaching event listener.
  2. //all method is based on 'on' method.
  3. //여기에 나오는 모든 메소드들은 on 메소드에서 파생된 메소드임
  4. //모든 태그에 이벤트를 다는 것보다, 상위태그에 이벤트를 달고 이벤트가 걸리는 시점에 작업을 하는 것이 보다 효율적임
  5. (function(){
  6. $('h2').click(function(){
  7. console.log("clicked");
  8. $(this).clone(true).appendTo('body');
  9. });
  10.  
  11. $('h2').bind('click',function(){
  12. console.log("clicked");
  13. $(this).clone(true).appendTo('body');
  14. });
  15.  
  16. $('h2').on('click', function(){
  17. console.log("clicked");
  18. $(this).clone(true).appendTo('body');
  19. });
  20.  
  21. $('h2').live('click', function(){
  22. console.log("clicked");
  23. $(this).clone().appendTo('body');
  24. });
  25. $('body').delegate('h2', 'click', function(){
  26. console.log("clicked");
  27. $(this).clone().appendTo('body');
  28. });
  29. $('body').on('click', 'h2', function(){
  30. console.log("clicked");
  31. $(this).clone().appendTo('body');
  32. });
  33. })();

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.