经验啦

  1. 首页 > 生活经验 > >

兼容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事件

相关经验推荐

上一篇：ie浏览器启用内容审查程序预防不良站点入侵

下一篇：ie9 提示’console’ 未定义问题的解决方法