마우스 이벤트

유명한 마우스 이벤트 종류

• mousedown·mouseup
  • 요소 위에서 마우스 왼쪽 버튼을 누를 때, 마우스 버튼 누르고 있다가 뗄 때 발생
• mouseover·mouseout
  • 마우스 커서가 요소 바깥에 있다가 요소 안으로 움직일 때, 커서가 요소 위에 있다가 요소 밖으로 움직일 때 발생
• mousemove
  • 마우스를 움직일 때 발생
• click
  • 마우스 왼쪽 버튼을 사용해 동일한 요소 위에서 mousedown 이벤트와 mouseup 이벤트를 연달아 발생시킬 때 발생
• dblclick
  • 동일한 요소 위에서 마우스 왼쪽 버튼을 빠르게 클릭할 때 발생
• contextmenu
  • 마우스 오른쪽 버튼을 눌렀을 때 발생

마우스 이벤트 순서

사용자가 단순히 마우스 왼쪽 버튼을 클릭 하더라도 mousedown, mouseup,  click 이벤트가 순서대로 발생한다.

마우스 버튼

클릭과 연관된 이벤트는 마우스의 어떤 버튼에서 이벤트가 발생했는지 알려주는 button 프로퍼티를 지원한다.

mousedown이벤트나 mouseup 이벤트를 다룰 때 어떤 버튼이 눌렸는지 확인할 때 유용할 수 있다.

event.which

event.which 프로퍼티는 어떤 버튼을 클릭했는지 알려주는 비표준 프로퍼티이다.