JS - event 기타사항

JS event 중 기타 사항에 대한 메모

focus, blur

• focus, blur 는 버블링 되지 않는다.
• blur 는 focus 가 해제된 뒤 발생하기 때문에 focus 해제를 막을 수 없다.
• 포커싱을 지원하지 않는 태그(div, span …)에 tabindex 속성을 통해 포커스를 지원할 수 있다.
• capturing 을 활용하여 이벤트를 위임할 수 있다.

change

• 요소의 변경이 끝나면 발생한다.
• 텍스트 입력의 경우 포커스가 해제되었을 때 발생한다.

input

• 값이 수정되었을 때매다 발생한다.
• 키보드가 아닌 다른 방식의 입력에서도 값이 변경되면 발생한다.
• 값이 수정되는 즉시 발생하기에 event.preventDefault() 는 효과가 없다.

cut, copy, paste

• 모두 ClipboardEvent 클래스의 하위클래스이다.
• event.preventDefault() 를 통해 기본동작을 막을 수 있다.
• 클립보드는 전역 OS 레벨이므로, 대부분의 브라우저는 안전을 위해 특정 사용자동작 범위에서만 클립보드의 읽기 쓰기를 허용한다.
• 대부분의 브라우저는 dispatchEvent 를 활용한 커스텀 클립보드 이벤트 생성을 금지하고 있다.
• event.clipboardData 프로퍼티를 통해 클립보드에 저장된 데이터를 읽고 쓸수 있다.

submit

• type="submit", type="image" 클릭하거나 input 필드에서 enter 누를 시 발생한다.
• event.preventDefault() 할 경우 전송되지 않는다.
• input 필드에서 엔터를 눌러 전송하면 type="submit" 의 클릭 이벤트가 트리거 된다.

출처

• 폼과 폼 조작

---

개인이 참고하고자 작성한 글이며, 잘못된 정보가 있을 수 있습니다. 잘못된 정보는 메일로 보내주시면 감사하겠습니다. 🙏