javascript 자바 jQuery 키 누르기 화살표 키



onkeydown (5)

jQuery에서 화살표 키 누르기를 캡처하려하지만 이벤트가 트리거되지 않습니다.

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

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

내가 그걸 잡아 내지 못하면 뭐가 잘못 됐어?


Answer #1
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();

});


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

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

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

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

Answer #3
$(document).on( "keydown",  keyPressed);

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

Answer #4

다음은 그 예입니다 : JSnippet DEMO keydown () vs keypress ()

.keypress() 은 키 유형 사용 e.which 를 잡기 위해 "화살표"를 무시하므로 .keypress() 을 사용해야 e.which

초점을 맞추려면 결과 화면을 누르고 (바이올린 화면의 오른쪽 하단) 화살표 키를 눌러 작동하는지 확인하십시오.

노트:

  1. .keypress() 는 Shift, Esc 및 Delete와 함께 실행되지 않지만 .keydown() 은 실행됩니다.
  2. 실제로 일부 브라우저에서 .keypress() 는 화살표 키로 트리거되지만 교차 브라우저가 아니므로 .keydown() 을 사용하는 것이 더 안정적입니다.

유용한 정보

  1. .keyCode 또는 이벤트 객체의 .keyCode 를 사용할 수 있습니다 .which 일부 브라우저는 그 중 하나를 지원하지 않지만 jQuery를 사용하면 jQuery가 표준화하므로 jQuery를 사용하는 것이 안전합니다. (나는 결코 문제가 없었던 것을 선호한다).
  2. ctrl | alt | shift | META 을 탐지하려면 ctrl | alt | shift | META ctrl | alt | shift | META 실제 캡처 된 키를 ctrl | alt | shift | META 키를 누르면 이벤트 객체의 다음 속성을 확인해야합니다. - 눌렀 으면 TRUE로 설정됩니다.
  3. 마지막으로 - 여기에 몇 가지 유용한 키 코드가 있습니다 (전체 목록 - keycode-cheatsheet ).

    • 입력 : 13
    • 최대 : 38
    • 아래 : 40
    • 오른쪽 : 39
    • 왼쪽 : 37
    • Esc : 27
    • 스페이스 바 : 32
    • Ctrl : 17
    • 대체 : 18
    • 시프트 : 16

Answer #5

화살표 키가 눌러져 있는지 확인할 수 있습니다.

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

jsfiddle 데모





keypress