输入事件比较

背景

学习IFE课程中，涉及到监听用户在输入框的输入对应的事件，相关事件有四个，分别为keyup，keypress，keydown和oninput。浏览器为chrome浏览器。
对于每个事件，监听一下三种方式输入：
1、一个字母一个字母的输入；
2、一个字母一个字母输入，同时加上按回车键，Esc键，上下左右键；
3、按住某个字母键不动。

事件触发顺序

keydown => keypress => keyup

keydown事件

一个字母一个字母输入，触发keydown事件。同时Esc，enter与上下左右键也触发keydown事件，按住某个字母键多次持续触发keydown事件。

keypress事件

一个字母一个字母输入，触发keypress事件。同时enter触发keydown事件，ESC键与上下左右键不触发keypress事件。按住某个字母键多次持续触发keydown事件。

keyup事件

一个字母一个字母输入，触发keyup事件。同时Esc，enter与上下左右键也触发keyup事件。按住某个字母键只触发一次keyup事件。

input事件

input事件在用户输入时触发。
该事件在<Input>或<textarea>元素的值发生改变时触发。
提示: 该事件类似于 change事件。不同之处在于 input 事件在元素值发生变化是立即触发，change在语速失去焦点时触发。另外一点不同是change事件也可以作用于<keygen>和<select>元素。
一个字母一个字母输入，触发input事件。同时Esc，enter与上下左右键不会触发keyup事件。按住某个字母键持续触发多次keyup事件。