oninput onpropertychange「建议收藏」

oninput 是 HTML5的标准事件,对于检测 textarea,input:text,input:password和input:search  oninput 事件在IE9以下版本不支持,是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生

大家好,又见面了,我是你们的朋友全栈君。

oninput 是 HTML5的标准事件,对于检测 textarea, input:text, input:password 和 input:search    oninput 事件在 IE9 以下版本不支持,是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效。

oninput要通过addEventListener()来注册,onpropertychange注册方法与一般事件相同。

onchange触发事件必须满足两个条件:
 a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
 b)当前对象失去焦点(onblur);
       也就是说并不是我们在打字的时候就会触发,而是在打完这后,焦点移出去之后,才触发;只有人工触发才有效,如果利用 JavaScript 程序改变是没有效果的

 onpropertychange    只要当前对象属性发生改变,都会触发事件,但是它是IE专属的;


 在textarea中,如果想捕获用户的键盘输入,用onkeyup检查事件就可以了,但是onkeyup并不支持复制和粘贴,因此需要动态监测textarea中值的变化,这就需要onpropertychange(用在IE浏览器)和oninput(非IE浏览器)结合在一起使用了。 

onpropertychange的bug     
在代码实现时,发现在响应用户onclick了textarea时,如果使用obj.className=”XX”;来改变textarea输入框中字体的样式,会导致在ie下会有在输入第一个字符的时候onpropertychange不会触发的bug,因此需要这样设置:obj.style.color=”#000″;

 oninput与onpropertychange失效的情况:

oninput事件:

(1)当脚本中改变value时,不会触发;

(2)从浏览器的自动下拉提示中选取时,不会触发;

onpropertychange事件:

当input设置为disable=true后,不会触发。


onpropertychange 这个事件在用户界面改变或者使用脚本直接修改内容两种情况下都会触发,有以下几种情况:
  • 修改了 input:checkbox 或者 input:radio 元素的选择中状态, checked 属性发生变化。
  • 修改了 input:text 或者 textarea 元素的值,value 属性发生变化。
  • 修改了 select 元素的选中项,selectedIndex 属性发生变化。

  在监听到 onpropertychange 事件后,可以使用 event 的 propertyName 属性来获取发生变化的属性名称。


oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search    oninput 事件在 IE9 以下版本不支持,是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效。

oninput要通过addEventListener()来注册,onpropertychange注册方法与一般事件相同。

onchange触发事件必须满足两个条件:
 a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
 b)当前对象失去焦点(onblur);

       也就是说并不是我们在打字的时候就会触发,而是在打完这后,焦点移出去之后,才触发;只有人工触发才有效,如果利用 JavaScript 程序改变是没有效果的

 onpropertychange    只要当前对象属性发生改变,都会触发事件,但是它是IE专属的;


 在textarea中,如果想捕获用户的键盘输入,用onkeyup检查事件就可以了,但是onkeyup并不支持复制和粘贴,因此需要动态监测textarea中值的变化,这就需要onpropertychange(用在IE浏览器)和oninput(非IE浏览器)结合在一起使用了。 




onpropertychange的bug     
在代码实现时,发现在响应用户onclick了textarea时,如果使用obj.className=”XX”;来改变textarea输入框中字体的样式,会导致在ie下会有在输入第一个字符的时候onpropertychange不会触发的bug,因此需要这样设置:obj.style.color=”#000″;


 oninput与onpropertychange失效的情况:

oninput事件:

(1)当脚本中改变value时,不会触发;

(2)从浏览器的自动下拉提示中选取时,不会触发;

onpropertychange事件:

当input设置为disable=true后,不会触发。




onpropertychange 这个事件在用户界面改变或者使用脚本直接修改内容两种情况下都会触发,有以下几种情况:
  • 修改了 input:checkbox 或者 input:radio 元素的选择中状态, checked 属性发生变化。
  • 修改了 input:text 或者 textarea 元素的值,value 属性发生变化。
  • 修改了 select 元素的选中项,selectedIndex 属性发生变化。

  在监听到 onpropertychange 事件后,可以使用 event 的 propertyName 属性来获取发生变化的属性名称。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/126761.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • matlab流场可视化后处理「建议收藏」

    matlab流场可视化后处理「建议收藏」matlab流场可视化后处理1流体中标量的可视化1.1云图1.2切片图绘制1.3三维等值面图绘制2流体中矢量的可视化2.1箭头图或速度图2.2流线图2.4带节点的流线图2.5流管图和流带图2.6圆锥体图2.7粒子动画图3参考链接1流体中标量的可视化流体力学中常见的标量为位置、速度绝对值、压强等。1.1云图常用的云图绘制有pcolor、image、imagesc、imsh…

    2025年6月16日
    2
  • ABA问题_乐观锁aba引发的实际问题

    ABA问题_乐观锁aba引发的实际问题ABA问题一.概述:二.什么是ABA问题?三.ABA问题的解决:原子引用:(存在ABA问题)带版本号的原子引用(解决ABA问题)一.概述:ABA问题是在多线程并发的情况下,发生的一种现象。上一次记录了有关CAS操作的一些知识,CAS通过比较内存中的一个数据是否是预期值,如果是就将它修改成新值,如果不是则进行自旋,重复比较的操作,直到某一刻内存值等于预期值再进行修改。而ABA问题则是在CAS操作中存在的一个经典问题,这个问题某些时候不会带来任何影响,某些时候却是影响很大的。二.什么是ABA问题?理解一

    2025年8月10日
    4
  • 2015年度总结「建议收藏」

    2015年度总结「建议收藏」2015年度总结

    2022年4月24日
    43
  • 傅里叶变换时域频域关系_傅里叶变换卷积性质

    傅里叶变换时域频域关系_傅里叶变换卷积性质我保证这篇文章和你以前看过的所有文章都不同,这是2012年还在果壳的时候写的,但是当时没有来得及写完就出国了……于是拖了两年,嗯,我是拖延症患者……这篇文章的核心思想就是:要让读者在不看任何数学公式的情况下理解傅里叶分析。傅里叶分析不仅仅是一个数学工具,更是一种可以彻底颠覆一个人以前世界观的思维模式。但不幸的是,傅里叶分析的公式看起来太复杂了,所以很多大一新生上来就懵圈并从此对…

    2022年10月7日
    2
  • 各种解决环境安德鲁斯(总结下,每次找各种)

    各种解决环境安德鲁斯(总结下,每次找各种)

    2022年1月1日
    48
  • 网络通信中 TCP 产生 RST 的三个条件分析

    网络通信中 TCP 产生 RST 的三个条件分析RST是TCP发生错误时发送的一种TCP分节(segment:传输层的PDU),可用来异常的关闭一个连接,此时客户端会返回一个ECONNREFUSED错误。它会在以下三种情况下产生:目的地为某个端口的SYN到达服务器,但并没有服务器在该端口监听。TCP想取消一个已有连接,即异常地关闭连接。TCP接收到一个根本不存在的连接上的分节。第一种情况可能有如下…

    2022年9月27日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号