관리 메뉴

Life goes slowly...

[jQuery] 자바스크립트 이벤트 등록 함수 - bind(), on(), live() 함수 본문

프로그래밍/Javascript

[jQuery] 자바스크립트 이벤트 등록 함수 - bind(), on(), live() 함수

빨강소 2020. 11. 1. 00:57
728x90
반응형

 

 

요소(element)에 자바스크립트(Javascript) 이벤트 핸들러를 지정하기 위한 함수로는. bind() , .on(), .live() 가 있습니다.

3개의 함수 모두 같은 역할을 하고 있지만 각각 함수마다 차이점이 있습니다. 

 

jQuery의 .bind() 함수

제이쿼리(jQuery)에서 사용되는 가장 기본적으로 사용되는 자바스크립트(Javascript) 이벤트 바인딩 함수입니다.

하지만 제이쿼리 1.7 버전 이후에. on() 함수가 나오면서 새로운 기능이 추가되지 않을 예정으로 점점 사라질 수도 있다는 이야기가 있어서 제이쿼리 1.7버전 이후에는. on() 함수를 사용하라고 가이드 되어 있습니다.

단일 요소(element)를 각 이벤트 처리기에 연결하며 복제된 요소(element)는. bind() 함수 처리기에 받을 수 없습니다. 복제된 요소를. bind() 처리하려면. unbind() 이벤트를 해제하고 다시 요소(element)에 바인딩 처리하여야만 합니다.

//사용법
$(select).bind(eventType,handler);

 

jQuery의 .live() 함수

제이쿼리(jQuery)에서 아직 생성되지 않은 요소(element)에도 추후에 생성될 때 이용할 수 있는 자바스크립트(Javascript) 이벤트를 미리 걸어둘 수 있는 함수입니다.

.bind() 함수와 같이 제이쿼리 1.7 버전 이후에는 사용을 자제하라는 가이드가 있습니다.

//사용법
$(select).live(eventType,handler);

 

jQuery의 .on() 함수

단일 요소(element)를 각 자바스크립트(Javascript) 이벤트 처리기에 연결하는 함수입니다.

.on() 함수는 제이쿼리 1.7부터 사용되어. bind() 함수 대체로 사용되고 있습니다. .bind() 함수의 단점을 보완하여 복제된 요소(element)도 이벤트 처리기를 받을 수 있습니다. .bin() 함수와. live() 함수, .delegate() 함수의 기능을 한 번에 통합한 함수입니다.

//사용법 
$(select).on(eventType,handler);

 

728x90
반응형
Comments