[JS] 키보드 이벤트 (keypress / keyup / keydown )

 

* keypress _키보드를 누를때 계속 실행 (어떤 값이 눌렸는지*)

* keydown  / keyup  _ 키보드를 누를 때(한번) / 뗄 때 실행 (물리적으로 어떤 키가 눌렸는지*)

 

* 동작순서 : keydown → keypress → keyup

 

---

 

입력값에 따른 작업처리는 keyup 사용하는게 좋음. ( keypress는 한글 인식 못함. )

예를 들어, iniput창의 값을 검색조건으로 Enter키 눌렀을 때 진행시키려면

(JavaScript)

<script>
document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('input').addEventListener('keyup', function(event) {
        if (event.keyCode === 13 || event.key === 'Enter) {
            Submit();
        }
    });
});
</script>

 

(Jquery)

<script>
$(document).ready(function() {
    $(document).on('keyup', input, function(event) {
        if (event.which === 13 || event.keyCode === 13) {
            submmit();
        }
    });
});
</script>

 

---

( keycode 정리 )

 

https://blog.munilive.com/posts/keyboard-keycode-value.html

Javascript 키보드 키코드 값