美文网首页
即时反应的input和propertychange方法

即时反应的input和propertychange方法

作者: MCherish | 来源:发表于2020-10-15 17:04 被阅读0次

    即时反应的input和propertychange方法

    在web开发中,我们有时会需要动态监听输入框值的变化,当使用onkeydown、onkeypress、onkeyup作为监听事件时,会发现一些复制粘贴等操作用不了,同时,在处理组合快键键的时候也很麻烦。这时候我们需要更专业的解决方案:HTML5标准事件oninput、onchange和IE专属的事件properchange。

    1.oninput&onchange:

    oninput和onchange都是事件对象,当输入框的值发生改变时触发该事件。不同的是,oninput是在值改变时立即触发,而onchange是在值改变后失去焦点才触发,并且可以用在非输入框中,如:select等。

    2.propertychange:

    功能同oninput,用以替代oninput在IE9以下的不兼容性。

    3.output:

    output是一个HTML5标签,IE系列浏览不兼容,主要用于计算输出。如:

    propertychange 和 input 事件:

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

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

    $(function(){ 

        $('#username').bind('input propertychange', function() {  

        $('#result').html($(this).val().length + ' characters');  

      });  

    })  

    这里bind同时绑定了input和propertychange两个方法。

    转自 https://www.cnblogs.com/LHYwin/p/6136256.html

    相关文章

      网友评论

          本文标题:即时反应的input和propertychange方法

          本文链接:https://www.haomeiwen.com/subject/fmycoctx.html