HTML5标准事件oninput、onchange和IE专属的事件properchange。

HTML5标准事件oninput、onchange和IE专属的事件properchange。

动态监听输入框值的变化，
当使用onkeydown、onkeypress、onkeyup作为监听事件时，
会发现一些复制粘贴等操作用不了，
同时，在处理组合快键键的时候也很麻烦。

这时候我们需要更专业的解决方案：
HTML5标准事件oninput、onchange和IE专属的事件properchange。

oninput和onchange区别

oninput和onchange都是事件对象，
当输入框的值发生改变时触发该事件。

不同的是，
oninput
是在值改变时立即触发，

onchange
是在值改变后失去焦点才触发，
并且可以用在非输入框中，如：select等。

propertychange 和 input 事件：

1）propertychange只要当前对象的属性发生改变就会触发该事件（专属ie)。

2）input是标准的浏览器事件，一般应用于input元素，
当input的value发生变化就会发生，
无论是键盘输入还是鼠标黏贴的改变都能及时监听到变化。

实例：

<script>
    $(function() {
        $('textarea').bind('input propertychange', function() {  
            $('#tips label').html($(this).val().length);
            });  
    });
</script>
</head>
<body>
    <form action="#" method="post">
        <div>输入需要分析的英文单词或句子</div>
        <div id=tips>
            <label>0</label>/50000
        </div>
        <div>
            <textarea maxlength="50000" required rows="6" cols="50" placeholder="请输入内容"></textarea>
        </div>

 

posted @ 2020-05-13 03:16  假程序猿  阅读(643)  评论(0)    收藏  举报