事件类型-文本事件

文本事件指的是当文本发生变化时所触发的事件

change

change事件常用于<input>、<textarea>、<select>等元素，在它们失去焦点且value值改变时触发

<input type="text" id="t">
<script>
  t.onchange = function() {
    console.log(this.value)
  }
</script>

input

input事件表示输入框内容发生变化时触发，但通过javascript改变value时不会触发。input与change事件的区别就是不需要移除焦点就可以触发

<input id="test">
<script>
test.oninput = function(e){
  console.log(this.value)
}
</script>

textInput

textInput是DOM3级引入的新事件，目的是为了替代keypress。当可编辑区域中的文本发生变化时会触发该事件

注意： 该事件只有chrome和safari浏览器支持

<input type="text" id="t">
<script>
  t.addEventListener('textInput', function(e){
    console.log(this.value, e.data)
  }, false)
</script>

textInput事件的event对象有一个data属性，属性的值就是用户输入的字符

textInput与keypress事件有两点不同

1. textInput事件只会在用户按下能够输入实际字符的键时才会被触发，而keypress事件则在按下那些能够影响文本显示的键时也会触发(如回车键)

2. 只有可编辑区域会触发textInput事件，而任何可以获得焦点的元素都可以触发keypress事件（如checkbox）

总结一句话，