兼容Firefox和IE的onpropertychange事件oninput

最新推荐文章于 2021-11-12 15:58:32 发布

aabbcc456aa

最新推荐文章于 2021-11-12 15:58:32 发布

阅读量651

点赞数

分类专栏： HTML/CSS/JS 文章标签： firefox ie function safari 浏览器 input

HTML/CSS/JS 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

onpropertychange 不被firefox所支持，如果想在firefox下正常使用,需要用oninput属性,以下方法亲自测试可用

于是在网上就找到了一个可行性方法~~ Firefox有个oninput事件效果和onPropertyChange一样，所以同时加上oninput和onPropertyChange问题就解决鸟~~~ oo….

<input type="text" οninput="cgColor(this);" onPropertyChange="cgColor(this);" maxlength="4" name="pt_bankou" id="pt_bankou" value="" />

还有一种方法-----------------------------------------------------------------------------

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

在文本框输入数据的时候，当键盘按下并放开的时候可以使用onkeyup来检测事件，onpropertychange能够捕获每次改变，而onchange需要执行某个事件才可以捕获。可是有的时候我们输入数据是采用粘贴的方式而不是键盘输入，这就需要实时检测文本框状态的改变。

[Ctrl+A 全选注: 如需引入外部Js需刷新才能执行]

例子：

复制代码代码如下:

 
 <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>