첫 번째 키를 눌렀을 때 'keydown'/ 'keyup'이 실행되지 않는 이유는 무엇입니까?

Question

왼쪽 및 오른쪽 화살표 키를 사용하여 x 축에서 움직이는 스프라이트가 있습니다. 'keydown'으로 이동하고 'keyup'에서 멈추도록 설정됩니다. 문제는 두 번째 키를 누른 후에 만 ​​움직입니다. 나는 또한 왼쪽 또는 오른쪽 키를 누르려고했는데, 키패드에서 여전히 스프라이트가 움직입니다. 다시 말하지만, 이것은 '같은'키를 두 번째 누른 후에 취소됩니다.

내 이벤트 내가 콘솔 로그를 설정 한 선 (54)

에서 시작, 그래서 이벤트를 살펴하면서 콘솔을 개방하여 이해하기 쉽게 할 수있다.

오, 예, 저는 EaselJS 라이브러리와 마우스 트랩 키보드 단축키 라이브러리를 사용하고 있습니다. 내 문제가 본질적으로 브라우저에 연결되어 있기 때문에 차이가 있는지 확신 할 수 없습니다. 모든 기존 코드에 대한 해결 방법이나 도움이 정말 좋습니다.

function move() { 
if (rightHeld) { // move right 
    var speed = 3; 
    chuck.x += speed; 
    chuck.scaleX = 1; 
} // end move right 

if (rightHeld && keyDown == false) { // animate move right 
    chuck.gotoAndStop('idle'); 
    chuck.gotoAndPlay('walk'); 
    keyDown = true; 
} // end animate move right 

if (leftHeld) { // move left 
    var speed = 3; 
    chuck.x -= speed; 
    chuck.scaleX =- 1; 
} // end move left 

if (leftHeld && keyDown == false) { // animate move left 
    chuck.gotoAndStop('idle'); 
    chuck.gotoAndPlay('walk'); 
    keyDown = true; 
    } // end animate move left 
} // end function move 

/* KEYDOWN*/ 
function handleKeyDown(event) { 
    Mousetrap.bind('right', function() { 
      rightHeld = true; 
      console.log('keydown right'); 

    }, 'keydown'); // end 'right' 

    Mousetrap.bind('left', function() { 
      leftHeld = true; 
      console.log('keydown left'); 

    }, 'keydown'); // end 'left' 

} // end function handleKeyDown 

/* KEY UP */ 
function handleKeyUp() { 
    Mousetrap.bind('right', function() { 
     chuck.gotoAndStop('walk'); 
     chuck.gotoAndPlay('idle'); 
     rightHeld = false; 
     keyDown = false; 
     console.log('keyup right'); 

    }, 'keyup'); // end 'right' 

    Mousetrap.bind('left', function() { 
     chuck.gotoAndStop('walk'); 
     chuck.gotoAndPlay('idle'); 
     leftHeld = false; 
     keyDown = false; 
     console.log('keyup left'); 

    }, 'keyup'); // end 'left' 

    } // end function handleKeyUp 

JSFiddle

감사 똑똑한 사람들!

Answer 1

첫 번째 시도에서 작동하지 않는 이유는 첫 번째 keydown/keyup에 이벤트 수신기를 바인딩하는 것입니다. the fixed fiddle을 확인하십시오.

변경 :

window.onkeydown = handleKeyDown; 
window.onkeyup = handleKeyUp; 

에이 같은 즉

handleKeyDown(); 
handleKeyUp(); 

, 당신이하고있는 일 :

button.onclick = function() { 
    button.onclick = function() { 
    alert("you click!"); 
    }; 
}; 

(see this fiddle as an example for the code above)

첫 번째 클릭이됩니다 다음 클릭에 대해 alert을 바인딩하지만 다른 작업은 수행하지 않습니다. 두 번째로 작동하는 이유와 비슷한 코드가 발생했습니다.