监听input变化的事件

能够监听input变化的事件

在须要监听input输入值改变的时候，能够经过原声DOM对象的事件oninput/onchange/onkeyup/onkeypress/onkeydown 事件来监听。

这几种事件的触发条件

事件名称	触发条件
onchange	事件会在域的内容改变时发生
oninput	事件在用户输入时触发
onkeyup	事件会在键盘按键被松开时发生
onkeypress	在按下按键时触发, 不能触发全部按键(例如：ALT, CTRL, SHIFT, ESC)
onkeydown	会在用户按下一个键盘按键时发生

这几种事件的区别

onchange事件只在键盘或者鼠标操做改变对象属性，且失去焦点时触发，脚本触发无效，而onkeydown/onkeypress/onkeyup在处理复制、粘贴、长按键 处理上会有问题。
onkeydown、onkeypress、onkeyup在复制文本的时候均没法感知。

oninput不用考虑是否失去焦点，无论js操做仍是键盘鼠标手动操做，只要HTML元素属性发生改变便可当即捕获到。

结论

若是要时时的监听input中值的变化，用oninput最合适

在react中，对input onChange跟原生DOM的oninput机制基本同样，只要HTML元素属性发生改变便可当即捕获到.能够参考这篇文档点击进入。