1、前言
由于工作需要,需实现一个类似于微博输入框的功能,在用户动态输入文字的时候,修改提示“您还可
以输入 XX 字”。如下图所示:
因此,稍微研究了一下 oninput,onpropertychange,onchange 的区别和用法,以及
onpropertychange 在 ie 浏览器下的一个 bug。
2、oninput,onpropertychange,onchange 的用法
onchange 触发事件必须满足两个条件:
a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
b)当前对象失去焦点(onblur);
onpropertychange 的话,只要当前对象属性发生改变,都会触发事件,但是它是 IE 专属的;
oninput 是 onpropertychange 的非 IE 浏览器版本,支持 refox 和 opera 等浏览器,但有
一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象 value 值发生
改变时奏效。
在 textarea 中,如果想捕获用户的键盘输入,用 onkeyup 检查事件就可以了,但是 onkeyup 并不支持
复制和粘贴,因此需要动态监测 textarea 中值的变化,这就需要 onpropertychange(用在 IE 浏览
器)和 oninput(非 IE 浏览器)结合在一起使用了。
3、代码实现:
第一种方法是直接写入 textarea 的 onpropertychange 和 oninput 属性
view plaincopy to clipboardprint?
1. <textareaid="wb_comment_content"name="wb_comment_content"onblur=
"blur_wb_textarea(this);"onfocus="click_wb_textarea(this);"onprop
ertychange="set_alert_wb_comment();"oninput="set_alert_wb_comment(
);"class="gary666"style="font-size:12px;"mce_style="font-
size:12px;">欢迎您每天来微评爱车哦……
评论1