[keyboard event] 키 입력시 입력값 검증

1. 목표

: 키보드에 글자가 입력될 때마다, 입력값을 검증하여 사용자가 보다 편리하게 사용할 수 있게 가이드를 해주고 싶다. 

그렇지 않으면 제출버튼을 눌러서야 이메일 형식이 틀렸음을 알게되는 것! 번거로움!

 

2. 문제점

: 입력과 동시에 결과를 표시해줘야하는데 한박자 느리게 검증해서 혼란스러움..

let passWordInput = document.querySelector("#dialog_input");
passWordInput.addEventListener("keydown", (e)=> {validationCheck(e)});

function validationCheck() {
// ... 생략
}

 

3. 원인

: 한글, 한자, 일본어 등 아시아권의 문자들은 한 글자를 입력하기 위해 조합이 필요하다. 이는 keypress 와 keydown 을 사용할 경우 제대로 작동하지 않을 수 있어 keyup을 쓰는게 좋다..!! (해결)

 

❛ 혼자공부하는자바스크립트(윤인성 지음) ❜