Skip to content

jQuery .on() 사용법

2013/03/08

http://www.mimul.com/pebble/default/2013/03/06/1362559765579.html

위 블로그에 보면 .bind(), .live(), .delegate() 대신 .on() 의 사용을 권고하고 있습니다.^^

근데 live 대신 쓰기 위해서는 아래와 같은 방법으로 작성해야된다고 해서 실제로 테스트해보았습니다.

$(document).on("click", ".foo", handler);
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <input type="button" value="추가" />
  <div id="parent"></div>
  
</body>
</html>
$(document).ready(function(){
  var i = 0;
  
  $('input').on('click', function(){
    $('#parent').append('<ul class="child">test = '+i+'</ul>');
    i++;
  });
  
  $(document).on('click', '.child', function(){
      alert($(this).html());
  });
  /* 작동 안함.
  $('.child').on(function() {
      alert($(this).html());
  });
  */
});
No comments yet

답글 남기기

아래 항목을 채우거나 오른쪽 아이콘 중 하나를 클릭하여 로그 인 하세요:

WordPress.com 로고

WordPress.com의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Twitter 사진

Twitter의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Facebook 사진

Facebook의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Google+ photo

Google+의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

%s에 연결하는 중

%d 블로거가 이것을 좋아합니다: