javascript

jQuery - 동적으로 생성된 element에 이벤트 걸기

코딩하는 둥아 2020. 8. 1. 01:49
728x90

jQuery로 element에 click과 같은 이벤트를 걸고 싶을 때가 있다.

하지만 동적으로 생성된 element에는 click 이벤트가 걸리지 않음을 알 수 있다.

이럴때는 단순히 click() 이벤트를 거는 것이 아니라 .on() event를 걸어주자!

그럼 성공적으로 클릭 이벤트를 넣을 수 있을 것이다

create버튼을 누르면 동적으로 생성되는 버튼들

// click event 안걸림
$('.newbtn').click(function(){
  var id = $(this).attr("id");
  alert("선택한 버튼을 삭제하겠습니다. : "+id);
  $('#'+id).remove();
})

// 성공적으로 .newbtn 클래스를 가진 element에 클릭 이벤트를 걸 수 있음
$(document).on("click", ".newbtn", function(){
  var id = $(this).attr("id");
  alert("선택한 버튼을 삭제하겠습니다. : "+id);
  $('#'+id).remove();
});
728x90