본문 바로가기
STUDY_NOTE/javascript & jQuery

[jQuery]키보드 이벤트 keydown(), keypress(), keyup()

by kh201 2020. 12. 28.

* 키보드 이벤트(Keyboard Event)

자바스크립트를 이용하여 웹페이지 상에서 사용자의 키보드 입력을 감지해서 처리하는 방법이다. 

 

 

  

.keydown() : 키 입력 시에 발생되는 이벤트 

.keyup()     : 키 입력 후에 발생되는 이벤트

.keypress() : 키 입력 시에 발생되는 이벤트

                (한글입력, 방향키, enter, tab, del키에 무반응,현재는 deprecated되어 권장되지 않음)

 

 

 

이런 식으로 사용했다.

회원가입 시 아이디 중복체크 후에 다시 아이디 변경하는 것에 사용함 

다르게는

$(document).on('keydown', '#id', function(){

        functionName('keydownTD');

});

이런식으로도 쓸 수 있는듯,,

 

 

발생되는 순서

    키보드를 누름 -> keydown() 이벤트 발생

    글자가 입력됨 -> keypress() 이벤트 발생

    키보드에서 손을 뗌 -> keyup() 이벤트 발생

 

참고 : blog.daum.net/dotiweb/4

 

[jQuery] 키보드 이벤트 (keydown, keypress, keyup)

[명령안내] .keydown() - 키 입력 시 발생되는 이벤트 .keypress() - keydown과 같이 키 입력 시 발생되는 이벤트지만 Enter, Tab 등의 특수키에는 발생하지 않음 .keyup() - 키 입력 후 발생되는 이벤트 [예제.

blog.daum.net

참고 : dororongju.tistory.com/91

 

[JQuery] 키보드 이벤트 발생 순서 (keydown / keypress 차이)

키보드 이벤트 키보드 이벤트 발생 순서 1. 키보드를 누릅니다. 2. keydown 이벤트가 발생합니다. 3. 글자가 입력됩니다. 4. keypress 이벤트가 발생합니다. 5. 키보드에서 손을 뗍니다 6. keyup 이벤트가

dororongju.tistory.com

참고: www.daleseo.com/js-key-events/

 

[자바스크립트] 키보드 이벤트 (keydown/keyup)

Engineering Blog by Dale Seo

www.daleseo.com