[javascript] 키가 다운되었는지 확인 하시겠습니까?

JavaScript에서 현재 키가 다운되었는지 감지하는 방법이 있습니까?

“keydown”이벤트에 대해 알고 있지만 그게 필요한 것은 아닙니다. 키를 누른 후 얼마 지나지 않아 여전히 눌려 있는지 감지하고 싶습니다.

추신 : 가장 큰 문제는 일정 시간이 지나면 키가 반복되기 시작하여 악마처럼 keydown 및 keyup 이벤트가 발생한다는 것입니다. 바라건대 단순한 isKeyDown (key) 함수가 있지만 그렇지 않다면이 문제를 극복하고 해결해야합니다.



답변

JavaScript에서 현재 키가 다운되었는지 감지하는 방법이 있습니까?

아니. 유일한 가능성은 각각 모니터링 keyup하고 keydown그리고 기억.

일정 시간이 지나면 키가 반복되기 시작하여 악마처럼 keydown 및 keyup 이벤트를 발생시킵니다.

안됩니다. 당신은 확실히 keypress반복 될 것이고 , 많은 브라우저에서 당신은 또한 반복 될 것입니다 keydown. 그러나 keyup반복된다면 그것은 버그입니다.

불행히도 완전히 들어 본 적이없는 버그는 아닙니다. Linux, Chromium 및 Firefox (Ubuntu와 같은 인기있는 배포판에있는 GTK +에서 실행되는 경우)에서 둘 다 보유 키에 대해 반복되는 keyup-keypress-keydown 시퀀스를 생성합니다. 키를 정말 빨리 두드리는 사람과 구별 할 수 없습니다.


답변

사용하는 것 외에도 keyupkeydown핵심 다운 될 때 추적하고 백업하는 리스너가 있는 특정 키가 아래 경우에 당신에게 일부 속성은 실제로.

window.onmousemove = function (e) {
  if (!e) e = window.event;
  if (e.shiftKey) {/*shift is down*/}
  if (e.altKey) {/*alt is down*/}
  if (e.ctrlKey) {/*ctrl is down*/}
  if (e.metaKey) {/*cmd is down*/}
}

이것은에서 그와 같은 모든 브라우저 생성 된 이벤트 객체에서 사용할 수 있습니다 keydown, keyup그리고 keypress당신이 사용 MouseMove 이벤트에 필요가 없습니다.

나는 내 자신의 이벤트 객체를 생성 시도 document.createEvent('KeyboardEvent')하고 document.createEvent('KeyboardEvent')과를 찾는 e.shiftKey등,하지만 난 운이 없었다.

Mac에서 Chrome 17을 사용하고 있습니다.


답변

내 솔루션 :

var pressedKeys = {};
window.onkeyup = function(e) { pressedKeys[e.keyCode] = false; }
window.onkeydown = function(e) { pressedKeys[e.keyCode] = true; }

이제 스크립트의 다른 곳에서 키를 눌렀는지 확인할 수 있습니다.

pressedKeys["code of the key"]

사실이면 키를 누릅니다.


답변

isKeyDown 함수와 같은 것이 있다고 생각하지 않지만 직접 작성할 수 있습니다.

기본적으로 길이가 모니터링하려는 키의 수인 배열을 만듭니다. 그런 다음 문서 / 페이지 / 컨트롤 keyUp 및 keyDown 이벤트를 사용하여 해당 키의 상태로 배열을 업데이트합니다.

그런 다음 특정 키가 눌려 있는지 확인하고 bool을 반환하는 함수를 작성합니다.

var keyEnum = { W_Key:0, A_Key:1, S_Key:2, D_Key:3 };
var keyArray = new Array(4);

function onKeyDown()
{
    // Detect which key was pressed
    if( key == 'w' )
        keyArray[keyEnum.W_Key] = true;
    // Repeat for each key you care about...
}

function onKeyUp()
{
    // Detect which key was released
    if( key == 'w' )
        keyArray[keyEnum.W_Key] = false;
    // Repeat for each key you care about...
}

function isKeyDown(key)
{
    return keyArray[key];
}

그것은 당신이 원하는 것을 성취 할 것입니다.


답변

이미 브라우저에 내장 된 것이 있는지 확인하기 위해 여기까지 왔지만없는 것 같습니다. 이것은 내 솔루션입니다 (Robert의 대답과 매우 유사).

"use strict";

const is_key_down = (() => {
    const state = {};

    window.addEventListener('keyup', (e) => state[e.key] = false);
    window.addEventListener('keydown', (e) => state[e.key] = true);

    return (key) => state.hasOwnProperty(key) && state[key] || false;
})();

그런 다음으로 키를 눌렀는지 확인할 수 있습니다 is_key_down('ArrowLeft').


답변

다른 사람들은 전에 이런 종류의 질문을 한 적이 있습니다 (지금 당장은 명백한 속임수를 보지 못했지만).

대답은 keydown이벤트 (및 그 쌍둥이 keyup)가 여러분이 얻는 모든 정보라는 것입니다. 반복은 운영 체제에 매우 견고하게 연결되어 있으며 응용 프로그램은 BIOS에서 키의 실제 상태를 쿼리 할 기회를 많이 얻지 못합니다.

이 작업을 수행해야하는 경우 수행 할 수있는 작업은 키를 프로그래밍 방식으로 디 바운스하는 것입니다. 기본적으로, 당신은 평가할 수 keydownkeyup자신을하지만 무시 keyup이 지난 후 너무 빨리 일어나는 경우 이벤트를 keydown… 또는 본질적으로, 당신은 당신의 응답 지연한다 keyup확실히 또 다른이 아니다으로 긴만큼 keydown의 0.25 초 같은과 함께 다음과 같은 이벤트 keyup.

여기에는 타이머 활동을 사용하고 이전 이벤트에 대한 밀리 초 시간을 기록하는 것이 포함됩니다. 매우 매력적인 솔루션이라고는 말할 수 없지만 …


답변

/*
Tracks what keys are currently down on the keyboard
*/

function keyboard_module(onUpdate){
    var kb = {};
    var unicode_mapping = {};
    document.onkeydown = function(e){
        var unicode=e.charCode? e.charCode : e.keyCode
        var key = getKey(unicode);
        kb[key] = true;
        if(onUpdate){
            onUpdate(kb);
        }
    }

    document.onkeyup = function(e){
        var unicode=e.charCode? e.charCode : e.keyCode
        var key = getKey(unicode);
        delete kb[key];
        if(onUpdate){
            onUpdate(kb);
        }
    }

    function getKey(unicode){
        if(unicode_mapping[unicode]){
            var key = unicode_mapping[unicode];
        }else{
            var key= unicode_mapping[unicode] = String.fromCharCode(unicode);
        }
        return key;
    }
    return kb;
}

function testing(kb){
    console.log('These are the down keys', kb);
}


var keyboard = keyboard_module(testing);

....
//somewhere else in the code
if(keyboard['K']){/*do something special */}