Chrome에서 키보드를 누를 때`delete` 및`.`를 감지하는 방법은 무엇입니까?

Question

.을 누르면 keydown, keypress 및 keyup의 세 가지 이벤트가 발생합니다. 내가 delete을 누르면

keydown 
    which: 190 == ¾ 
    keyCode: 190 == ¾ 

keypress 
    which: 46 == . 
    keyCode: 46 == . 

keyup 
    which: 190 == ¾ 
    keyCode: 190 == ¾ 

그것은 이 이벤트, keydown 및 keyup을 발생합니다.

keydown 
    which: 46 == . 
    keyCode: 46 == . 

keyup 
    which: 46 == . 
    keyCode: 46 == . 

나는 .를 누르고 해당 문자 (46 == .)를 얻을 수 있어야합니다. 그러나 keydown과 keyup에 나는 190이 있는데 이는 ¾입니다. keypress에서 올바른 값을 얻었지만 delete을 누르면이 이벤트가 시작되지 않습니다.

delete을 누르면 keydown 및 keyup에 코드 46가 표시됩니다. 그러나 46 코드는 delete이 아니라 .입니다.

. 키 또는 delete 키가있는 경우 어떻게 두 키를 캡처하고 차이를 알리는 이벤트를 만들 수 있습니까? 시험에

페이지 : http://jsfiddle.net/Eg9F3/

Answer 1

는

$("textarea").keydown(function(e) { 
    // if the key pressed was found on the list of specialChars 
    if (specialChars[e.keyCode]) 
    { 
     // triggers the fake event 
     $("textarea").trigger("chromekeypress", e); 

     // temporary avoid keypress from firing 
     $("textarea").unbind("keypress"); 
     setTimeout(function(){ $("textarea").bind("keypress", handleKey); },10); 
    } 
}); 

$("textarea").keypress(handleKey); // main event 

$("textarea").bind("chromekeypress", chromeKeyPress); // chrome workaround 

function chromeKeyPress(i,e){ 
    e.type="chromekeypress"; 
    e.which = 0; // copy Firefox behavior, which == 0 means a special key pressed 
    handleKey(e); // fires the main event 
} 
function handleKey(e) { 

    // which is going to be 0 if it is a special key 
    // and keycode will have the code of the special key 
    // or 
    // which will have the value of the key 

    $("#r").html($("#r").html() + "\n" + 
     e.type + "\n" + 
     " which: " + e.which + " == " + String.fromCharCode(e.which) + "\n" + 
     " keyCode: " + e.keyCode + " == " + String.fromCharCode(e.keyCode) + "\n" + 
    ""); 
} 

Answer 2

의 값은 "누르기"의 핸들러 동일한 의미없는 "한" "이는"A "를 keyDown"또는 "의 keyup"핸들러이다. 이 경우 키보드의 키는 키 코드이고 은이 아니며 문자 서수입니다. "keypress"에서는 문자이지만, (당신이 알아 차렸 듯이) Del에 대한 "keypress"를 얻지 못합니다.

따라서 "keypress"처리기의 "keydown"및 "keyup"이벤트와 다른 46입니다 (Del).

"keydown"또는 "keyup"을 사용하고 키 코드를 확인해야합니다.

Answer 3

사실 그것은 이상하지만 논리입니다.

함수 대신 String.fromCharCode는

이유는 단순히 keyCode에 의해 필터링하지 않습니다 (... 왼쪽, 삭제)되지 KB 조치로, 실제 문자 코드와 함께 일하고있다? 나는 파이어 폭스와 같은 행동을 강요 한

Answer 4

example on jsFiddle 나는 최선의 해결책은 다음, 원하는 키 (demo)를지도 누른 키가 무엇인지 상호 참조에 e.which을 사용하는 것입니다 생각 . 브라우저 간 keyCode 값의 good reference이 있는데 jQuery가 e.which 값을 정규화하기 때문에이 경우 작동합니다.

var keys = { 
    46 : 'del', 
    190 : '.' 
}; 

$("textarea").bind('keyup', function(e){ 
    $('#r').append('keyup (' + e.which + '): ' + (keys[e.which] || String.fromCharCode(e.which))); 
}); 

이 jQuery UI 사용하는 방법과 유사하다 - 파일의 상단에있는 키 코드 상호 참조를 참조? 그리고 그것은 내가 keycaster 플러그인에서 사용하는 방법이기도합니다.