Advanced Search

jQuery Event Attachment

/ Published in: JavaScript
Save to your folder(s)
다양한 형태로 jQuery를 이용하여 DOM 요소에 이벤트를 다는 방법

Expand | Embed | Plain Text

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.