• 빠른 이동을 원하시면, 아래 키워드를 클릭하세요!

🌿 키보드감지

keydown, keyup, keypress 란?

keydown 이벤트는 사용자가 키를 눌렀을 때 발생합니다. 키가 눌리는 순간 트리거되며, 여러번 키보드를 누를 경우, 여러번 발생합니다.

주로 입력필드에 글자를 입력할 때 실시간으로 반응할 필요가 있을 때 사용됩니다.

document.addEventListener('keydown', function(event) {
    console.log('Key down: ', event.key);
});

keyup 이벤트는 사용자가 키에서 손을 뗄 때 발생합니다. 키를 떼는 순간 트리거 됩니다.

주로 입력이 완료 된 후에 검색과 같은 특정 동작을 하거나, 검증을 수행할때 사용 되요.

document.addEventListner('keyup' function(event){
	console.log('Key up:' , event.key);
	});

keypress 이벤트는 deprecated 되었으니 무엇인지만 참고해주세요. 사용자가 문자를 입력할 때 발생하고 일반적으로 알파벳이나, 숫자, 기호 등과 같은 인쇄 가능한 문자에 대해 트리거 됩니다. 키보드의 모든 키에 대해 발생하지 않는것이죠. 😱 현재는 상황에 따라 keyup 이나 keydown으로 대체되는것이 권장됩니다.

📝 실습 코드