oninput,onpropertychange,onchange区别

借鉴了

http://blog.csdn.net/sunlylorn/article/details/6123355增加了一个脚本 文本框文字减少的脚本

1.onchange触发事件必须满足两个条件：

    a）当前对象属性改变，并且是由键盘或鼠标事件激发的（脚本触发无效）
    b）当前对象失去焦点(onblur)；

2.onpropertychange的话，只要当前对象属性发生改变，都会触发事件，但是它是IE专属的；

3.oninput是onpropertychange的非IE浏览器版本，支持firefox和opera等浏览器，但有一点不同，它绑定于对象时，并非该对象所有属性改变都能触发事件，它只在对象value值发生改变时奏效。

 

window.onload = testFun;
var z = {};
z.id = function (id){
    return document.getElementById(id);
}
z.bind = function (id,type,fun){
    if(document.all)
    {
        return id.attachEvent("on" + type , fun);
    }
    else
    {
        return id.addEventListener(type , fun , false);
    }
}

var tester = z.id("test");
var num_er = z.id("now");

function testFun()
{    

    var oninputing = document.all ? "propertychange" : "input" ;
    z.bind(tester,oninputing,showNum);
}

function showNum(){
    if ( 100 - tester.value.length <= 0)
    {
        tester.value = tester.value.slice(0,100);
    }
    num_er.innerHTML = (100 - tester.value.length);
}

<textarea id="test">
请输入文字
</textarea>
<div>您还可以输入<font id="now" color="#FF0000">100</font>个字</div>