본문 바로가기

좋아하는 것_매직IT/31.jquery

제이쿼리(jquery) bind 와 unbind 를 이용한 이벤트 등록 및 제거 깔끔하게 정리하기

반응형

 

블로그 목적 

제이쿼리(jquery) 이용한 bind와 unbind  대해서 공부및 정리후 나만의 노하우와 지식을 공유한다.

블로그 요약

1. 제이쿼리 이벤트 등록및 제거 방법 에 대해서 알아본다.
2. bind와 unbind  기능을 구현 해본다. 


블로그 상세내용

우선, 제이쿼리(jquery) 이벤트 등록및 제거 방법에 대해서 알아볼까요?

jquery 에서는 요소에 이벤트 핸들러를 지정하고 제거하기 위해서 사용하는 함수가 있는데요...
차근차근 알아보시죠~

1. 이벤트 핸들러를 지정하려면 어떻게 해야 할까요? 
 - 정답 : bind() 함수 사용하기 
2. 이벤트 핸들러 제거하려면 어떻게 해야 할까요?
 - 정답 : unbind() 함수 사용하기

그럼, bind()함수와 unbind()함수에  대해서 알아볼까요?

1. bind() 함수

간단설명)
.bind(eventType,handler)

id가 magic_btn이라는 요소에 이벤트 핸들러를 추가를 합니다.
 - eventType은 click, handler는 "매직 버튼 클릭" 이라는 문구를 출력하는 알럿창이 나오도록 함수를 지정했습니다.

위와 같이 코딩을 하시면 id가 magic_btn요소를 클릭시 '매직 버튼 클릭' 문구가 화면에 알럿창으로 표시가 되겠죠?

2.unbind() 함수

간단설명) 
.unbind([eventType] [, handler])

위와 같이 코딩하시면, id가 magic_btn인 요소에 추가된 이벤트를 제거하게되는데요..

경우의 수를 알아보면요..
첫째, 매개변수가 없으면 모든 이벤트 제거하게 되고요
둘째, eventType 지정시 지정된 이벤트 제거하게 됩니다. 
마지막으로, handler 지정시 click에 대한 이벤트는 남아있어도 핸들러에 해당되는 부분이 제거가 됩니다. 

참고로 자세한 내용은 아래 웹페이지를 참고하시면 좋을것 같네요..




오늘의 블로그는 여기까지고요..
항상믿고 봐주셔서 감사합니다. 

728x90
300x250