HTML5 input事件检测输入框变化

之前一直用change事件来监听输入框内容是否发生变化，只有当输入框失去焦点时才会触发，没想到html5还有个input事件，只要输入框内容发生变化就会立即触发，既然有这么好的东西我们干嘛放着不用呢，接下来就来给大家介绍一下：

如果我们页面上有这样一个简单到极致的输入框：

<input type="text">

那么我们现在用jquery给它绑定input事件，如下：

$("input:text").bind("input propertychange",function(){

　　console.log($(this).val().length);//打印输入框字符长度

});

这样一来只要输入框内容发生变化，都会立即打印出里面字符串的长度来了。

需要注意的是input事件是html5的东东，IE9以下版本中是无法支持的，所以需要用propertychange事件来代替。

input事件除了能够监听input:text元素的内容变化，同时还可以监听input:password,input:search以及textarea这几个元素，在html绑定的写法为：

<input type="text" oninput="onInput(event)" onpropertychange="onPropertyChange(event)">

原创文章，转载请注明来自一个萝卜一个坑 -博客园[http://www.cnblogs.com/luozhihao]
本文地址：/article/5267115.html