Keycody JavaScript

Unicode wszystkich klawiszów klawiatury, w tym numeryczne, alfabety, znaki specjalne itpKeycody". Jak wiemy, JavaScript jest językiem skryptowym po stronie klienta, często wymagane jest znanie kodu klucza powiązanego z postacią podczas przetwarzania tekstu lub znaków wprowadzonych do elementu formularza na stronie internetowej.

Ten samouczek ilustruje użycie kodów kluczy w JavaScript ze szczegółowymi przykładami. A więc zacznijmy!

Jak używać klodów kluczy JavaScript?

Po naciśnięciu lub zwolnieniu klawisza klawiatury, w każdej przeglądarce mogą nastąpić trzy różne zdarzenia po stronie klienta, keypress, keyUp. Po naciśnięciu klawisza klawiatury zdarzenie KeyDown jest uruchamiane, a natychmiast wykonuje się zdarzenie Keypress. Po wydaniu klucza zdarzenie klucza jest uruchamiane.

Wydarzenia te można wykorzystać do uzyskania kodu klucza w zależności od wymagań. Sprawdź podane przykłady, aby wyczyścić swoją koncepcję.

Przykład 1: Sprawdź, kiedy klawisz jest naciśnięty lub wciśnięty

W tym przykładzie wiadomość zostanie wyświetlona na konsoli, gdy klawisz zostanie naciśnięty, a następnie naciśnięty, naciskając i zwalniając klawisz na klawiaturze. Aby to zrobić, najpierw utworzymy nagłówek i dwa pola wejściowe z identyfikatorami, „TXT1" I "TXT2”:

Keycody JavaScript

W pliku JavaScript będziemy pobierać pierwsze pole wejściowe za pomocą „getElementById ()„Metoda, przekazując id”TXT1”Jako argument, a następnie zadzwoń do„addEventListener ()„Metoda, w której„wydarzenie.PreventDefault ()„Zostanie nazywana metodą, która sprawdzi, jaki rodzaj zdarzenia jest uruchamiany:

dokument.getElementById („txt1”).addEventListener („KeyDown”, funkcja (event)
wydarzenie.PreventDefault ();
konsola.log ('$ wydarzenie.typ');
);

Podobnie zrobimy to samo dla drugiego pola wejściowego z id ”TXT2”:

dokument.getElementById („txt2”).addEventListener („keyUp”, funkcja (event)
wydarzenie.PreventDefault ();
konsola.log ('$ wydarzenie.typ');
);

W rezultacie wyjście pokaże „Keydown”Wiadomość na konsoli po naciśnięciu klawisza, podczas gdy kontrola kursora znajduje się w pierwszym polu wejściowym, a gdy klawisz zostanie naciśnięty w drugim polu wejściowym, nie pojawi się nowy komunikat na konsoli, dopóki klawisz nie zostanie zwolniony i "Keyup„Wydarzenie jest wyzwalane:

Chcesz pobrać kod klawiszowy po naciśnięciu klawisza? Spójrz na poniższy przykład!

Przykład 2: Zdobądź Unicode na KeyPress za pomocą „zdarzenia.który atrybut ”

W tym przykładzie postaramy się zdobyć Unicode of Keys, naciskając je losowo. Aby to zrobić, utworzymy dwie etykiety, jedna jest przeznaczona do drukowania instrukcji, a druga drukują UniCodes na KeyPress:

Keycody JavaScript

Naciśnij dowolny klawisz, aby uzyskać kod tego klucza:

W pliku JavaScript uzyskaj dostęp do „Onkeydown„Własność„ „dokument„Obiekt, który wywołuje funkcję„CheckCodeofpressedKey”Podczas nacisku klawisza. Nazwiemy „wydarzenie.Który”Atrybut używany do wejścia klucza klawiatury, ponieważ normalizuje on„wydarzenie.Kod Klucza" I "wydarzenie.bodek”Wartości. Funkcja zwróci kod klawisza, który zostanie naciśnięty:

dokument.onkeydown = checkCodeofpressedKey;
FunkctionCheckCodeofpressedKey (e)
var kodeCode;
if (okno.wydarzenie)
KeyCode = okno.wydarzenie.Kod Klucza;

Elseif (e)
KeyCode = e.Który;

dokument.getElementById („Unicode”).innerHtml = KeyCode;

Wyjście

Omówiliśmy wszystkie podstawowe informacje związane z klodami kluczowymi w JavaScript.

Wniosek

Unicode wszystkich klawiszów klawiatury, w tym numeryczne, alfabety i znaki specjalne, nazywa się „Keycody". JavaScript jest często wymagany, aby poznać kod kluczy powiązany z postacią podczas przetwarzania tekstu lub znaków wprowadzonych do elementu formularza na stronie internetowej. W tym samouczku zilustrowaliśmy użycie kodów kluczy w JavaScript ze szczegółowymi przykładami.