第一步:了解输入框的一个属性onpropertychange
单击输入框发现也会触发onpropertychange,输入一个值同样也会触发这个事件,这就证明了,只要有属性的值被修改就会触发该事件。
第二步:限制长度
<textarea onpropertychange="if(value.length>100) value=value.substr(0,100)" class="smallArea" cols="60" name="txta" rows="8"></textarea>
第三步:中文只能输入10个,全ASCII码能够输入20个
<script>
function check() {
var regC = /[^ -~]+/g; //中文正则
var regE = /D+/g; //ASCII正则
var str = t1.value;
if (regC.test(str)){
t1.value = t1.value.substr(0,10);
}
if(regE.test(str)){
t1.value = t1.value.substr(0,20);
}
}
</script>
<textarea maxlength="10" id="t1" onpropertychange="check();">
</textarea>
第四步:兼容性问题
不知道你有没发现这个属性有一定的兼容性问题,在FF上就不起作用了,要让FF支持onPropertyChange类似的效果
于是在网上就找到了一个可行性方法: Firefox有个oninput事件效果和onPropertyChange一样
<textarea maxlength="10" id="t1" onpropertychange="check();" oninput="check();">
</textarea>