화살표 키 중 하나를 눌렀을 때 어떻게 감지합니까? 나는 이것을 사용하여 알아 냈습니다.
function checkKey(e) {
var event = window.event ? window.event : e;
console.log(event.keyCode)
}
다른 모든 키에서 작동했지만 화살표 키에서는 작동하지 않았습니다 (브라우저가 기본적으로 이러한 키를 스크롤해야하기 때문일 수 있음).
답변
화살표 키를은으로 트리거 onkeydown
하지 onkeypress
.
키코 드는 다음과 같습니다.
- 왼쪽 = 37
- 최대 = 38
- 오른쪽 = 39
- 아래로 = 40
답변
키 업 및 다운 콜 기능. 각 키마다 다른 코드가 있습니다.
document.onkeydown = checkKey;
function checkKey(e) {
e = e || window.event;
if (e.keyCode == '38') {
// up arrow
}
else if (e.keyCode == '40') {
// down arrow
}
else if (e.keyCode == '37') {
// left arrow
}
else if (e.keyCode == '39') {
// right arrow
}
}
답변
event.key === “화살표”…
더 최근의 훨씬 더 깨끗한 : use event.key
. 더 이상 임의의 숫자 코드가 없습니다! 번역하고 있거나 사용자가 최신 브라우저를 사용하고 있다는 것을 알고 있다면 이것을 사용하십시오!
node.addEventListener('keydown', function(event) {
const key = event.key; // "ArrowRight", "ArrowLeft", "ArrowUp", or "ArrowDown"
});
자세한 처리 :
switch (event.key) {
case "ArrowLeft":
// Left pressed
break;
case "ArrowRight":
// Right pressed
break;
case "ArrowUp":
// Up pressed
break;
case "ArrowDown":
// Down pressed
break;
}
이를 확인 "w", "a", "s", "d"
하거나 다른 키 를 쉽게 확장 할 수 있습니다.
PS event.code
는 화살표 와 동일
답변
아마도 가장 까다로운 공식 :
document.onkeydown = function(e) {
switch (e.keyCode) {
case 37:
alert('left');
break;
case 38:
alert('up');
break;
case 39:
alert('right');
break;
case 40:
alert('down');
break;
}
};
데모 (사용자 Angus Grant에게 감사드립니다) : http://jsfiddle.net/angusgrant/E3tE6/
브라우저 간 작동해야합니다. 작동하지 않는 브라우저가 있으면 의견을 남겨주십시오.
키 코드 (예 : e.charCode 및 e 대신 window.event)를 얻는 다른 방법이 있지만 필요하지는 않습니다. http://www.asquare.net/javascript/tests/KeyCode.html 에서 대부분을 시험해 볼 수 있습니다 . event.keycode는 Firefox에서 onkeypress와는 작동하지 않지만 onkeydown과는 작동합니다.
답변
화살표 키와 같이 인쇄 할 수없는 키 keydown
에는 사용 하지 마십시오 keypress
.
function checkKey(e) {
e = e || window.event;
alert(e.keyCode);
}
document.onkeydown = checkKey;
내가 찾은 최고의 JavaScript 키 이벤트 참조 (예 : quirksmode에서 바지를 치는)는 다음과 같습니다. http://unixpapa.com/js/key.html
답변
keyCode 는 이제 key 를 선호하기 때문에 더 이상 사용되지 않습니다 .
document.onkeydown = function (e) {
switch (e.key) {
case 'ArrowUp':
// up arrow
break;
case 'ArrowDown':
// down arrow
break;
case 'ArrowLeft':
// left arrow
break;
case 'ArrowRight':
// right arrow
}
};
답변
가장 최근의 방법은 다음과 같습니다.
document.addEventListener("keydown", function(event) {
event.preventDefault();
const key = event.key; // "ArrowRight", "ArrowLeft", "ArrowUp", or "ArrowDown"
switch (key) { // change to event.key to key to use the above variable
case "ArrowLeft":
// Left pressed
<do something>
break;
case "ArrowRight":
// Right pressed
<do something>
break;
case "ArrowUp":
// Up pressed
<do something>
break;
case "ArrowDown":
// Down pressed
<do something>
break;
}
});
이것은 개발자가 코드가 페이지의 어느 곳에서나 활성화되기를 원하고 클라이언트는 다른 키 누름을 무시해야한다고 가정합니다. event.preventDefault ()를 제거하십시오. 이 핸들러에 의해 포착 된 키를 포함하여 키 누르기가 여전히 활성화되어 있어야합니다.