兼容Firefox和IE的onpropertychange事件oninput

【字号: 日期:2024-06-03浏览:7作者:雯心
在文本框输入数据的时候,当键盘按下并放开的时候可以使用onkeyup来检测事件,onpropertychange能够捕获每次改变,而onchange需要执行某个事件才可以捕获。可是有的时候我们输入数据是采用粘贴的方式而不是键盘输入,这就需要实时检测文本框状态的改变。onpropertychange不被firefox所支持,如果想在firefox下正常使用,需要用oninput属性,且需要用addEventListener来注册事件。 //当状态改变的时候执行的函数 function handle() {document.getElementById(’msg’).innerHTML=’输入的文字长度为:’+document.getElementById(’txt’).value.length; } //firefox下检测状态改变只能用oninput,且需要用addEventListener来注册事件。 if(/msie/i.test(navigator.userAgent)) //ie浏览器 {document.getElementById(’txt’).onpropertychange=handle } else {//非ie浏览器,比如Firefox document.getElementById(’txt’).addEventListener('input',handle,false); } [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]例子: 复制代码 代码如下:html body divoninput测试/div divid='testdiv'inputid=’tx1’name='tx1'value=''//div /body /html scriptlanguage='JavaScript' !-- functiongetOs(){//判断浏览器类型 varOsObject=''; if(navigator.userAgent.indexOf('MSIE')0){ return'MSIE'; } if(isFirefox=navigator.userAgent.indexOf('Firefox')0){ return'Firefox'; } if(isSafari=navigator.userAgent.indexOf('Safari')0){ return'Safari'; } if(isCamino=navigator.userAgent.indexOf('Camino')0){ return'Camino'; } if(isMozilla=navigator.userAgent.indexOf('Gecko/')0){ return'Gecko'; } } if(navigator.userAgent.indexOf('MSIE')0){ document.getElementById(’tx1’).attachEvent('onpropertychange',txChange); }elseif(navigator.userAgent.indexOf('Firefox')0){ document.getElementById(’tx1’).addEventListener('input',txChange2,false); } functiontxChange(){ alert('testie'); } functiontxChange2(){ alert('testfirefox'); } /script以上就是兼容Firefox的onpropertychange事件方法。 您可能感兴趣的文章:输入框的字数时时统计—关于 onpropertychange 和 oninput 使用js监听输入框值的即时变化onpropertychange、oninputjavascript开发中使用onpropertychange,oninput事件解决onchange事件的不足asp.net关于onpropertychange和oninput事件实现代码js propertychange和oninput事件
相关文章: