Wykryj klawisze do wydruków

Question

Muszę wykryć, czy klawisz, który został właśnie naciśnięty, jest kluczem do wydrukowania, jak znak, ewentualnie akcentowany, liczba, spacja, symbol interpunkcyjny itd., Lub klawisz niedrukowalny, np. ENTER, TAB lub DELETE.

Czy jest to niezawodny sposób, aby to zrobić w JavaScript, inne niż lista wszystkich kluczy niedrukowalnych i mam nadzieję, że nie zapomnisz niektóre?

Answer 1

Odpowiedziałem wczoraj na similar question. Zwróć uwagę, że musisz użyć zdarzenia keypress dla wszystkich związanych z postacią; keydown nie zrobi.

Chciałbym argumentować, że Wprowadzić jest do druku, przy okazji, a ta funkcja uważa, że ​​jest. Jeśli nie zgadzasz, możesz zmienić go odfiltrować naciśnięć klawiszy z właściwością zbioru zdarzeń which lub keyCode do 13.

function isCharacterKeyPress(evt) { 
    if (typeof evt.which == "undefined") { 
     // This is IE, which only fires keypress events for printable keys 
     return true; 
    } else if (typeof evt.which == "number" && evt.which > 0) { 
     // In other browsers except old versions of WebKit, evt.which is 
     // only greater than zero if the keypress is a printable key. 
     // We need to filter out backspace and ctrl/alt/meta key combinations 
     return !evt.ctrlKey && !evt.metaKey && !evt.altKey && evt.which != 8; 
    } 
    return false; 
} 

var input = document.getElementById("your_input_id"); 
input.onkeypress = function(evt) { 
    evt = evt || window.event; 

    if (isCharacterKeyPress(evt)) { 
     // Do your stuff here 
     alert("Character!"); 
    } 
}); 

Answer 2

szczęście to zadanie jest znacznie łatwiejsze w nowoczesnych przeglądarkach. Możesz teraz użyć KeyboardEvent.key, aby wykryć klucz do wydrukowania przez jego długość.

test.onkeydown = e => { 
 
    let isPrintableKey = e.key.length === 1; 
 
    alert(`Key '${e.key}' is printable: ${isPrintableKey}`); 
 
}

<input id="test">

Poza tym, można również wykryć wszelkie inne klucze z listy, jak Enter, Delete, Backspace, Tab itp

Metoda ta jest dużo bardziej niezawodny po prostu dlatego, w przeciwieństwie do event.which, event.key jest już ustandaryzowany.