jQuery 이벤트 종류

⊙ 이벤트(Event)
•기본적으로 전역에 작성된 프로그램은 프로그램이 실행됨과 동시에 바로 실행되지만 함수(Function)으로 묶인 부분은 호출되지 않으면 실행되지 않는다.
•이러한 이유 때문에 원하는 시점에 원하는 기능을 실행하기 위해 프로그램이 실행되는 계기가 필요하다.
•이런 역할을 하는 것이 Event이며, 모든 함수는 Event와 연결되어 호출되는 형태를 가진다.

◆ jQuery의 이벤트 처리 방식 - 객체에 직접 이벤트를 등록

- 선언적 함수 -
function sum(){
  alert(“hello”);
}
$(“div”).click(sum);

- 익명적 함수 -
$(“div”).click(function(){
  alert(“hello”);
});

◆ jQuery 마우스 이벤트

이벤트	설명
click	노드(elements)를 마우스 포인터로 눌렀다가 떼었을 때에 발생
dblclick	노드를 더블 클릭 했을 때에 발생
hover	mouseenter와 mouseleave 이벤트를 한번에 bind한다.
mousedown	노드 영역에서 마우스를 눌렀다가 떼었을 때에 발생
mouseenter	노드에 마우스가 진입했을 때에 발생(자식노드에서는 이벤트를 감지 못함)
mouseleave	마우스가 노드에서 벗어났을 때에 발생
mousemove	노드 영역에서 마우스를 움직였을 때에 발생
mouseout	노드에서 마우스 포인터가 떠났을 때에 발생
mouseover	노드 영역에서 마우스를 올려놓았을 때 발생 (내부노드까지 이벤트를 감지)
mouseup	마우스 포인터를 노드에 올려놓고 마우스 버튼을 눌렀다 떼었을 때에 발생
toggle	click 이벤트에 핸들러를 바인딩하고 클릭할 때마다 실행될 함수들을 차례대로 실행

 

◆ jQuery 문서로딩 이벤트

이벤트	설명
ready	해당 페이지가 로딩되었을 때에(처음 읽힐 때에) 발생
unload	해당 페이지를 빠져나갈 때에 발생

 

◆ jQuery 폼 이벤트

이벤트	설명
blur	노드에서 포커스가 떠날 때에 발생
change	노드의 값이 변경될 때에 발생
focus	노드가 포커스를 획득했을 때에 발생
select	유저가 텍스트를 선택했을 때에 발생
submit	폼의 내용을 전송할 때에 발생

 

◆ jQuery 키보드 이벤트

이벤트	설명
keydown	해당 영역에서 키보드를 눌렀을 때에 발생
keypress	해당 영역에서 키보드를 계속 누르고 있을 때에 발생
keyup	해당 영역에서 키보드를 눌렀다가 떼었을 때 발생

 

◆ jQuery 웹 브라우저 이벤트

이벤트	설명
resize	웹브라우저 윈도우 사이즈의 변화가 있을 때
scroll	스크롤이 움직일 때에 발생