DOM 요소에 대한 jQuery 키보드 이벤트

다른 개별 키 누르기로 CSS를 전환 한 두 개의 div가있는 프로젝트를 만들고 있습니다. https://github.com/jeresig/jquery.hotkeys/DOM 요소에 대한 jQuery 키보드 이벤트

당신이있어 간단한 데모를 볼 수 있습니다 :

내가이 jQuery 라이브러리 사용하고

<div class="test_box" id="red"></div> 

<div class="test_box" id="green"></div>

내 CSS :

.test_box { 
width: 200px; 
height: 200px; 
border: 2px solid #000; 
margin: 20px; 
float: left; 
} 

.red { 
background-color: red; 
} 

.green { 
background-color: green; 
}

다음 http://lazarogamio.com/projects/key_test/

나의 HTML입니다

그리고 내 jQuery :

function keymap(){ 

$(document).bind('keydown', 'r', function (evt){ 
    $('#red').toggleClass('red'); 
    }); 

$(document).bind('keydown', 'g', function (evt){ 
    $('#green').toggleClass('green'); 
    }); 
}; 

$(document).ready(keymap);

현재 keydown 이벤트가 작동하지만 모든 키와 두 div에 해당합니다. 원래 각 div는 별도의 기능으로 제어되었지만 결과는 동일했습니다. 나도 아무 것도 할 수없는 다른 키를 매핑하려고했지만 아무 소용이 없었다. 내 직감은 키를 올바르게 타겟팅하지 않거나 함수를 올바른 개체에 바인딩하지 않는 것입니다.

출처

2013-02-07 Lazaro Gamio