兼容Firefox和IE的onpropertychange事件oninput

兼容Firefox和IE的onpropertychange事件oninput
在文本框输入数据的时候,当键盘按下并放开的时候可以使用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事件

推荐阅读