JavaScript Event Learning Chapter 1 key Detection

The first problem is that there is no standard for button events. According to the standard, the event model containing the keyboard and other input devices will be explained in future DOM specifications.

As we have learned, the browser does not have a standard in its initial design. Everyone is like doing an experiment. Although the final product is useful, it certainly causes compatibility problems. Key-pressing issues are no exception: Here there are two attributes that can detect the keys that the user presses. Although there are enough reasons why two attributes are required, not all browsers support them.

In addition, there are some important differences between keypress, keydown, and keyup.

Finally, there is a difference between windows and mac. On mac, it is almost N times more difficult to detect the keys that a user presses than on windows.

KeyCode and charCode
It can be detected that the two attributes of the user's key are keyCode and charCode. To put it simply, the keyCode is used to detect the key that the user actually presses on the keyboard, while the charCode is the ASCII code that gives the entered characters. Note: The keyCode of uppercase and lowercase A is the same, because they are a key on the keyboard; but charCode is different, because they are two different characters.

IE and Opera do not support charCode. However, they will save the character information in the keyCode, but only in the case of onkeypress, onkeydown/up contains the key information.

Character and number key
Let's start with a simple example. The ASCII code of lowercase a is 97, and that of uppercase is 65. In either case, when the user clicks the same key on the keyboard, when is the key value 65 (equivalent to A in upper case)

KeyCode

 

CharCode

Therefore, in the case of onkeydown/up, you can get the key value from the keyCode. In onkeypress, to obtain the character value, use: evt. charCode | evt. keyCode.

Punctuation Marks
I decided not to test the punctuation key. I suspect this is not only related to browsers and operating systems, but also to keyboard settings and the default language. I usually use Dutch windows. I would not be surprised if I had a lot of difference with the American 101-key keyboard.

For example, shift +, the key should be <, but the result of the ASCII code I tested is '? . When I found this problem, I decided not to waste time on the punctuation key issue.

Special key
Function keys are only those that cannot be printed but have certain functions. For example, shift, ESC, and enter are all function keys.

Notes:
1. Generally, mac is less reliable than windows, and some keys may not be detected.

2. IE will not trigger the following keypress events: delete, end, enter, escape, function key, home, insert, pageUp/Down, And tab.

3. In the onkeypress event, Safari will give the following key very strange keyCode values: delete, end, function key, home and pageUp. Down. However, it is normal under onkeydown/up.

4. The Alt, Cmd, Ctrl, and shfit keys cannot be detected on mac, except for Opera. However, you can use the altKey, ctrlKey, and shfitKey attributes.

If you need to detect these keys, you just need to download the keyCode under onkeydown/up. You can just help yourself. Just forget onkeypress and charCode.

There is a large list of key values behind the original text, and a test box. If you are interested, you can move on.
Http://www.quirksmode.org/js/keys.html

Reprinted please keep the following information
Author: Beiyu (tw: @ rehawk)