jQuery Keypress 화살표 키

jQuery Keypress 화살표 키

---

jQuery에서 화살표 키 누름을 캡처하려고하는데 이벤트가 트리거되지 않습니다.

$(function(){
    $('html').keypress(function(e){
        console.log(e);
    });
});

이것은 영숫자 키에 대한 이벤트를 생성하지만 삭제, 화살표 키 등은 이벤트를 생성하지 않습니다.

캡처하지 않기 위해 내가 뭘 잘못하고 있습니까?

---

예 : JSnippet DEMO keydown () vs keypress ()

당신은 사용해야 .keydown()하기 때문에 .keypress()"화살표"무시 키 타입의 사용을 잡기 위해,e.which

결과 화면을 눌러 초점을 맞춘 다음 (피들 화면의 오른쪽 하단) 화살표 키를 눌러 작동하는지 확인합니다.

메모:

1. .keypress()Shift, Esc 및 Delete로 실행되지 않지만 실행 .keydown()됩니다.
2. 실제로 .keypress()일부 브라우저에서는 화살표 키에 의해 트리거되지만 브라우저 간이 아니므로 .keydown().

더 유용한 정보

3. .whichOr .keyCodeof the event object를 사용할 수 있습니다. 일부 브라우저는 그중 하나를 지원하지 않지만 jQuery를 사용할 때 jQuery는 사물을 표준화하므로 둘 다 사용하는 것이 안전합니다. (나는 .which결코 문제가 없었 으면 좋겠다 ).
4. ctrl | alt | shift | META실제 캡처 된 키로 누름 을 감지하려면 이벤트 개체의 다음 속성을 확인해야합니다. 누를 경우 TRUE로 설정됩니다.
   • event.ctrlKey -ctrl
   • event.altKey -alt
   • event.shiftKey -교대
   • event.metaKey-META ( Command ⌘ 또는 Windows 키 )

5. 마지막으로 유용한 키 코드가 있습니다 (전체 목록 -keycode-cheatsheet ) :

   • 입력 : 13
   • 위로 : 38
   • 아래 : 40
   • 오른쪽 : 39
   • 왼쪽 : 37
   • Esc : 27
   • 스페이스 바 : 32
   • Ctrl : 17
   • Alt : 18
   • 근무조 : 16

---

$(document).keydown(function(e) {
    console.log(e.keyCode);
});

키 누르기 이벤트는 화살표 키를 감지하지만 모든 브라우저에서는 그렇지 않습니다. 따라서 keydown을 사용하는 것이 좋습니다.

다음은 콘솔 로그에 있어야하는 키 코드입니다.

• 왼쪽 = 37
• 위로 = 38
• 오른쪽 = 39
• 아래로 = 40

---

다음과 같이 화살표 키를 눌렀는지 확인할 수 있습니다.

$(document).keydown(function(e){
    if (e.keyCode > 36 && e.keyCode < 41) 
      alert( "arrowkey pressed" );          
});

jsfiddle 데모

---

JQuery의 링크를 참조하십시오

http://api.jquery.com/keypress/

그것은 말한다

keypress 이벤트는 브라우저가 키보드 입력을 등록 할 때 요소로 전송됩니다. 이는 수정 자 및 Shift, Esc 및 삭제와 같은 인쇄되지 않는 키가 keydown 이벤트를 트리거하지만 keypress 이벤트가 아니라는 점을 제외하면 keydown 이벤트와 유사합니다. 플랫폼과 브라우저에 따라 두 이벤트 간의 다른 차이점이 발생할 수 있습니다.

즉, 화살표의 경우 키 누르기를 사용할 수 없습니다.

---

left = 37,up = 38, right = 39,down = 40

$(document).keydown(function(e) {
switch(e.which) {
    case 37:
    $( "#prev" ).click();
    break;

    case 38:
    $( "#prev" ).click();
    break;

    case 39:
    $( "#next" ).click();
    break;

    case 40:
    $( "#next" ).click();
    break;

    default: return;
}
e.preventDefault();

});

---

$(document).on( "keydown",  keyPressed);

function keyPressed (e){
    e = e || window.e;
    var newchar = e.which || e.keyCode;
    alert(newchar)
}

참고 URL : https://stackoverflow.com/questions/19347269/jquery-keypress-arrow-keys