Question: Press the ENTER key when entering text in Chinese input method; the binding keyup event will input the English text in the input method into the text box and directly touch the send button
Keyboard events:
When a key is pressed or released, three keyboard events may be triggered in each browser
keydown
keypress
keyup
The keydown event occurs when the key is pressed, then keypress is triggered. The keyup event is triggered when the key is released.
Chinese input method:
firfox: input trigger keydown, enter confirm input trigger keyup
chrome: Input triggers keydown and keyup, enter to confirm that the input only triggers keydown
IE: Input triggers keydown and keyup, enter to confirm input triggers keydown, keyup
Safari: input trigger keydown and keyup, enter to confirm input trigger keydown, keyup
opera: input trigger keydown and keyup, enter to confirm input trigger keydown, keyup
In input and textarea, when in Chinese input method: no keypress event is triggered
Keypress event: The support for Chinese input method is poor, and it cannot respond to Chinese input; it cannot respond to system function keys
HTML code:
<textarea name="" id="text" cols="30" rows="5"></textarea> <script type="text/javascript"> var text = document.getElementById('text'); text.onkeydown = function(e) { console.log('keydown'); if(e.keyCode == 13) { console.log('keydown enter send'); } console.log('value', text.value); } text.onkeypress = function(e) { console.log('keypress'); console.log('value', text.value); } text.onkeyup = function(e) { console.log('keyup'); if(e.keyCode == 13) { console.log('keyup enter send'); } console.log('value', text.value); } </script>English input method:
The above picture shows the conclusion:
Keydown and keypress happen when the text has not been typed into the input box. If the text box is output in the keydown and keypress events, the text in the text box before the keyboard event is triggered;
When the keyup event is triggered, the operation of inputting text on the entire keyboard event has been completed, and what is obtained is the text content after the keyboard event is triggered.
Chinese input method: [No keypress event]
After pressing the enter key to confirm:
The Chinese input method presses the Enter key when the input is not determined. The effect of keydown and keyup is different. Keydown will not trigger the preset Enter method event.
answer:
Most input methods complete the input process in keydown, so if the input submission is in the keyup event, the input key will be sent directly to the input key and the input key will be submitted, resulting in conflict problems.
Method: Change the input submission event to keydown. At this time, when the keydown event occurs, it is in the input method, and will not occur in the sending event of the submission box, thereby resolving the conflict.
Some tips:
After KeyDown is triggered, KeyUp may not be triggered. When KeyDown is pressed and drag the mouse, the KeyUp event will not be triggered.
KeyPress is mainly used to capture ANSI characters except F1-12, SHIFT, Alt, Ctrl, Insert, Home, PgUp, Delete, End, PgDn, ScrollLock, Pause, NumLock, {menu key}, { start key } and arrow keys.
KeyDown and KeyUp can usually capture all keys on the keyboard except PrScrn
KeyPress can only capture single characters
KeyDown and KeyUp can capture key combinations.
KeyPress captures the case of a single character
KeyDown and KeyUp are both a value for the KeyValue captured by a single character, which means that the case of a single character cannot be judged.
KeyPress does not distinguish between numeric characters from the primary keyboard.
KeyDown and KeyUp distinguish numeric characters from the primary keyboard.
Among them, the PrScrn keys KeyPress, KeyDown and KeyUp cannot be captured.
When using the keyboard, you usually use the key combination function similar to CTRL+SHIFT+ALT.
The above article on the conflict resolution of the input method and the shortcut key for sending message is all the content shared by the editor. I hope it can give you a reference and I hope you can support Wulin.com more.