on 이벤트

onFocus

특정 개체에 포커스가 이동했을시 일어나는 이벤트

 

onBlur

특정 개체에 포커스가 빠져나갔을때 일어나는 이벤트

 

onMouseOver

특정 개체에 마우스 커서가 이동했을때 일어나는 이벤트

 

onMouseOut

특정 개체에 마우스 커서가 빠져나갔을때 일어나는 이벤트

 

onClick

특정 개체를 클릭했을때 일어나는 이벤트

 

onChange

특정 개체의 값이 변경되었을때 일어나는 이벤트

 

onKeyDown

특정 개체에 키보드 작성 후 키보드를 눌릴때 일어나는 이벤트

 

onKeyUp

특정 개체에 키보드 작성 후 키보드가 올라갈때 일어나는 이벤트

 

ex)

<input type="text" id="test" onBlur="this.value='포커스잃음'" onFocus="this.value='포커스온'" onKeyUp="style.backgroundColor='blue'" onKeyDown="style.backgroundColor='red'" onMouseOver="this.value='마우스오버'" onMouseOut="this.value='마우스아웃'" onClick="window.open('http://www.naver.com')">

 

==================

한개의 이벤트만 발생 시킬때는 위와 같이 각 이벤트에 하나의 이벤트를 걸면 되고,

그렇지 않을 경우,

onMouseOver="function()" 형태로 함수를 걸어주면,

여러가지 이벤트를 발생시킬 수 있다.

==================

onChange 이벤트는 현재 걸려있는 이벤트가 너무 많아 패스하도록 한다.

onChange 이벤트는 value 값이 변화함에 따라 일어나는 이벤트 이며,

 

나는 주로 checkbox 의 값 변화시 alert 를 띄우거나,

 

select 의 값이 변화할 경우 div 액션을 일으키는 형태로 사용한다.

[출처] on 이벤트|작성자 키에르