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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 广东地区电信官方DNS服务器

    广东地区电信官方DNS服务器以下是广东地区电信官方DNS服务器,简单记录,以备后用!主解析服务器:202.96.128.143202.96.128.68202.105.80.210缓存服务器(亦可作DNS解析之用)cache-b

    2022年7月4日
    56
  • 排序-冒泡排序

    排序-冒泡排序排序算法之【冒泡排序】在写代码之前我们需要对冒泡排序有一个逻辑上的理解:即什么是冒泡排序呢?冒泡排序是排序算法的其中一种,该排序的逻辑理解起来较为容易,理解上可以有两种方式,一种中正向的思维,一种是逆向的思维,什么意思呢?所谓的正向思维就是从前往后,从左往右,从上到下。那么逆向思维呢就正好与之相反。下面来说一正向思维下的冒泡排序:…

    2022年6月17日
    26
  • 树莓派3B+ 软件源更改

    树莓派3B+ 软件源更改树莓派3B+软件源更改由于树莓派软件官方源在国外,所以连接不稳定,且速度慢,所以安装初次进入系统后,一定要修改一下软件源。国内软件源有很多,在这里,我推荐自己常使用的:中国科学技术大学Raspbianhttp://mirrors.ustc.edu.cn/raspbian/raspbian/1.替换脚本下面脚本请直接复制到终端

    2022年6月25日
    24
  • 2021.12.13版本pycharn激活码_在线激活

    (2021.12.13版本pycharn激活码)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~0…

    2022年3月30日
    32
  • Java 方法

    Java 方法

    2021年10月7日
    36
  • ES集群搭建「建议收藏」

    ES集群搭建「建议收藏」1.设置内核参数:/etc/sysctl.confvm.max_map_count=6553602.设置文件描述符限制:/etc/security/limits.conf*softnofile65536*hardnofile131072*softnproc2048*hardnproc4096&&1和2的配置,可以等到启动时候报错,再修改(可以清晰地知道1、2在处理什么问题)3.es不允许root用户启动,修改用户和分组chownuser1.

    2022年10月13日
    0

发表回复

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

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