兼容Firefox和IE的onpropertychange事件oninput

原文 兼容Firefox和IE的onpropertychange事件oninput

onpropertychange能够捕获每次输入值的变化。例如:对象的value值被改变时,onpropertychange能够捕获每次改变,而onchange需要执行某个事件才可以捕获。

在文本框输入数据的时候,当键盘按下并放开的时候可以使用onkeyup来检测事件,onpropertychange能够捕获每次改变,而onchange需要执行某个事件才可以捕获。可是有的时候我们输入数据是采用粘贴的方式而不是键盘输入,这就需要实时检测文本框状态的改变。
onpropertychange 不被firefox所支持,如果想在firefox下正常使用,需要用oninput属性,且需要用addEventListener来注册事件。

例子:

复制代码代码如下:

<html>  
<body>  
<div>oninput测试</div>  
<div id="testdiv"><input id=‘tx1‘ name="tx1" value="" /></div>  
</body>  
</html>  
<script language="JavaScript">  
    <!--  
function getOs(){//判断浏览器类型  
    var OsObject = "";  
   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);  
}else if(navigator.userAgent.indexOf("Firefox")>0){  
    document.getElementById(‘tx1‘).addEventListener("input",txChange2,false);  
}  
function txChange(){  
    alert("testie");  
}  
function txChange2(){  
    alert("testfirefox");  
}  
</script> 

以上就是兼容Firefox的onpropertychange事件方法。

兼容Firefox和IE的onpropertychange事件oninput

时间: 2024-10-09 16:39:13

兼容Firefox和IE的onpropertychange事件oninput的相关文章

总结oninput、onchange与onpropertychange事件的用法和区别

前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现,但是这存在着一些不好的用户体验.比如onchange事件只在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效:而onkeydown/onkeypress/onkeyup在处理复制.粘贴.拖拽.长按键(按住键盘不放)等细节上并不完善. onpropertychange属性可

同时绑定onpropertychange 和 oninput 事件,实时检测 input、textarea输入改变事件,支持低版本IE,支持复制粘贴

实时检测 input.textarea输入改变事件,支持低版本IE,支持复制粘贴 检测input.textarea输入改变事件有以下几种: 1.onkeyup/onkeydown 捕获用户键盘输入事件. 缺陷:复制粘贴时无法检测 2.onchenge 缺陷:要满足触发条件:当前对象的属性改变(由键盘或鼠标触发)且对象失去焦点 3.onpropertychange 当前对象属性改变就会触发 缺陷:只支持低版本IE 4.oninput 和onpropertychange类似,当前对象属性改变就会触发

总结oninput、onchange与onpropertychange事件的用法和区别 书写搜索的神奇代码

总结oninput.onchange与onpropertychange事件的用法和区别 最近手机开发一个模糊搜索的功能组建,在网上就找到这篇文章! 前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现,但是这存在着一些不好的用户体验.比如onchange事件只在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效:而onkeyd

IE9浏览器onpropertychange和oninput事件对delete键和剪切不触发问题解决方法

一.问题 对于输入框实时监听,常用oninput事件,低版本的IE浏览器使用onpropertychange事件.但是还有一点瑕疵就是IE9对于输入框的剪切和delete键的操作没有任何反应,这是一件非常悲伤的事情. 二.方法 亮点:keyUp监听delete和剪切,手动触发事件 代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>

总结oninput、onchange与onpropertychange事件的使用方法和差别

前端页面开发的非常多情况下都须要实时监听文本框输入,比方腾讯微博编写140字的微博时输入框hu9i动态显示还能够输入的字数. 过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现,可是这存在着一些不好的用户体验. 比方onchange事件仅仅在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效:而onkeydown/onkeypress/onkeyup在处理复制.粘贴.拖拽.长按键(按住键盘不放)等细节上并不完好. onpropertychang

onchange onpropertychange 和oninput事件

汇总onchange onpropertychange 和oninput事件的区别:                1.onchange事件与onpropertychange事件的区别:                             onchange事件在内容改变(两次内容有可能还是相等的)且失去焦点时触发:onpropertychange事件却是实时触发,即每增加或删除一个字符就会触发,通过js改变也会触发该事件,但是该事件IE专有.                 2.oninpu

oninput和onpropertychange事件简单介绍

oninput和onpropertychange事件简单介绍:这两个事件可能稍感陌生,但是在处理某些事件的时候却是非常的好用的,本章节将简单介绍一下这两个事件的用法.在实际应用中可能需要监听一些输入框值的变化,当然我们可以使用onkeydown.onkeypress.onkeyup 等事件完成,但是这些事件并不能够监听右键复制.黏贴和剪切等功能,这个时候oninput和onpropertychange事件的威力就显现出来了,下面就介绍一下它们.一.oninput事件:此事件是HTML5中的标准事

兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法

兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法 // 获取事件function getEvent(){ if(window.event) {return window.event;} func=getEvent.caller; while(func!=null){ var arg0=func.arguments[0]; if(arg0){ if((arg0.constructor==Event || arg0.constructor ==MouseEv

oninput、onchange与onpropertychange事件的区别

onchange事件只在键盘或者鼠标操作改变对象属性,value的值发生变化且失去焦点时触发,用户js改变value时无法触发: onkeydown/onkeypress/onkeyup键盘事件来监测的话,监听不了右键的复制.剪贴和粘贴这些操作. oninput是标准浏览器的事件,对于检测 textarea, input:text,input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用,在内容修改后立即被触发,不像 onchange 事件需要失去