Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can javascript tell the difference between left and right shift key?

Mostly this is a sanity check. The key code for both shift keys is 16. Does that mean it is actually impossible to distinguish a left and right shift events in a browser?

like image 938
Weavermount Avatar asked Feb 26 '14 00:02

Weavermount


People also ask

Is there a difference between left and right Shift?

The left and right Shift key on a computer keyboard perform the same function. When pressed and held down, it changes the case of the letter to uppercase, or use the alternate character on any other key. For example, pressing and holding down the Shift key while pressing the letter "a" makes a capital "A".

Do you use left or right Shift key?

Use the right shift key when typing letters or symbols with the left hand. Use the left shift key when typing letters or symbols with the right hand. To strike a shift key, reach finger outward and back, quickly tap shift key and then return finger to home row.

What does the right Shift key look like?

On the right side, the Shift key is below the Enter or Return key and above the Ctrl key. There is often an upward-pointing arrow (symbol) on the Shift key. The picture is a close-up view and example of the Shift key.

What is the difference between Shift key and control key?

The Shift key is a so-called control key on the computer keyboard. By pressing the Shift key, for example, the special characters on the keys 0 - 9 can be activated. Where is the Shift key in Windows 10? Most keyboards have two shift keys, these are indicated by the ⇧ symbol.


2 Answers

In newer browsers supporting DOM3 you can use event.location to check the location.

In the DOM3 spec, there are 4 constants defined for location, DOM_KEY_LOCATION_STANDARD, DOM_KEY_LOCATION_LEFT, DOM_KEY_LOCATION_RIGHT, andDOM_KEY_LOCATION_NUMPAD.

In this case, you can do:

if (event.location === KeyboardEvent.DOM_KEY_LOCATION_LEFT){  } else if (event.location === KeyboardEvent.DOM_KEY_LOCATION_RIGHT){  } 
like image 99
loganfsmyth Avatar answered Sep 21 '22 20:09

loganfsmyth


You can use event.code (the physical keyboard string) instead of event.key (the numeric ascii value).

event.code MDN docs

The KeyboardEvent.code property represents a physical key on the keyboard (as opposed to the character generated by pressing the key).

If you scroll down to "Code values" at the bottom, you can find the two distinct shift keys:

"ShiftLeft", "ShiftRight"

like image 32
clabe45 Avatar answered Sep 21 '22 20:09

clabe45