본문으로 바로가기

on, off 그리고 one

category 스터디/Javascript · jQuery 2014. 10. 7. 11:59

bind()on() 모두 DOM에 이벤트 핸들러를 바인딩 시킬경우 사용될 수 있습니다.
이전 버전에서는 bind() unbind() / live() die()를 사용했습니다.

jquery 1.7버전 부터는 .on() 사용을 권장하고 있습니다.
bind()는 이벤트 핸들러를 엘리먼트에 즉시 바인드 시킵니다.(미리 생성되어 있는 엘리먼트만 사용가능)
bind()가 적용된 핸들러 삭제시에는 unbind()를 사용합니다.

one()이라는 메서드도 있는데 이 녀석은 한 번 실행 후 자동으로 unbind() 해줍니다.

on()의 동작은 이와 좀 다릅니다.
ajax로 로딩된 동적 엘리먼트에도 핸들러 바인딩이 가능합니다.
on()이 적용된 핸들러 삭제는 off()를 사용합니다.

여기서 주의사항은 동적으로 엘리먼트에 핸들러 등록시 selector"document"로 걸어줘야 합니다.

$(docuemnt).on("click", "selector", function(e){});

어느곳에 언제 동적으로 로딩될지 모르니 on이 호출 될때에 전체 DOM에서 찾은 후 바인드 시켜주는 듯 합니다.

'스터디 > Javascript · jQuery' 카테고리의 다른 글

이벤트 버블링과 캡쳐링  (0) 2014.10.07
콜백패턴  (0) 2014.10.07
트리거 trigger  (0) 2014.10.07
jquery has / :has  (0) 2014.10.07
JavaScript 함수  (0) 2014.10.07