jquery/js实时监听输入框值发生变化的有效方法

在前端页面,实时的监听输入框,文本框的值发生变化,来统计已经输入的字数可能会经常用到,我们希望在内容修改后立即显示,而不是像onchange、onblur、onkeyup等事件,在内容改变、失去焦点、某个键盘的键被松开才触发,而且很多复杂的场景下,这些事件并没有全部触发。

其实我们可以同时绑定oninput,onpropertychange事件,

 $('#content').bind('input propertychange', function() {
alert($(this).val().length + ' characters');
});


onpropertychange事件是IE特有的事件,这个事件在用户界面改变或者使用脚本直接修改内容两种情况下都会触发,有以下几种情况:

  1. 修改了 input:checkbox 或者 input:radio 元素的选择中状态, checked 属性发生变化。
  2. 修改了 input:text 或者 textarea 元素的值,value 属性发生变化。
  3. 修改了 select 元素的选中项,selectedIndex 属性发生变化。

在监听到 onpropertychange 事件后,可以使用 event 的 propertyName 属性来获取发生变化的属性名称。


绑定了这样两个事件,也可以解决对IE的兼容性。


转载请注明:6K & 3o » jquery/js实时监听输入框值发生变化的有效方法

评论:

来了,赞!

回复 取消回复

<bold style="color:blue;">html编码呢</bold>

回复 取消回复

谢谢这位朋友,其实<textarea>这个加了的,前三个<input>忘加了,

回复 取消回复

来了!

回复 取消回复

加油!

回复 取消回复

留下你的评论: