Ajax를 통해 불러온 데이터에 클릭 이벤트 바인딩하는법

ajax를 통해 불러온 데이터는 기존에 사용하던 방법으로는 이벤트를 바인딩하지 못한다.

그래서 ajax를 만들 때에 하드코딩으로 바로 event를 넣어버리는 경우가 있는데, event는 따로 javascript태그 안에 만들어 두는 것이 유지보수나 가시성에서 편리하다.

따라서 다른 방법으로 바인딩하는 것이 좋다.

 

$(document).on('click', '클래스명 혹은 id', function(){

  이벤트 내용.

});

이렇게 하면 javascript로 만들어진 값에 클릭 이벤트를 넣을 수 있고, 당연히 ajax로 불러온 데이터도 가능하다.

 

 

 

참고로 click 이벤트 이외에도 여러 이벤트를 바인딩 할 수 있다.

자주 쓰이는 이벤트를 적자면

이벤트명	용도
mouseover	마우스가 올라왔을 경우
mouseout	마우스가 나갔을 경우
mousemove	마우스를 누르는 경우
mousedown	마우스를 움직이는 경우
moseup	마우스를 눌렀다 놓는 경우
dragdrop	마우스를 누르고 움직이는 경우
keydown	키보드를 입력하는 경우
keypress	키보드를 누르는 경우
keyup	키보드를 눌렀다가 놓는 경우
load	페이지를 읽어오는 경우
unload	현재 페이지를 나갈 때
beforeunload	현재 페이지에서 나가기 전에

여기서 unload와 beforeunload의 차이는

beforeunload의 차이는 나가려고 하기 전에 이벤트가 동작하여 진짜 나갈건지 확인하고

unload는 나갈 때에 동작하여 내용을 실행한다.