input获取焦点 原生js_原生js的input事件

input获取焦点 原生js_原生js的input事件1.onfocus当input获取到焦点时触发2.onblur当input失去焦点时触发,注意:这个事件触发的前提是已经获取了焦点再失去焦点的时候才会触发该事件,用于判断标签为空。3.onchange当input失去焦点并且它的value值发生变化时触发,个人感觉可以用于注册时的确认密码。4.onkeydown按下按键时的事件触发,5.onkeyup当按键抬起的时候触发的事件,在该…

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

1.onfocus  当input 获取到焦点时触发

2.onblur  当input失去焦点时触发,注意:这个事件触发的前提是已经获取了焦点再失去焦点的时候才会触发该事件,用于判断标签为空。

3.onchange 当input失去焦点并且它的value值发生变化时触发,个人感觉可以用于注册时的确认密码。

4.onkeydown 按下按键时的事件触发,

5.onkeyup 当按键抬起的时候触发的事件,在该事件触发之前一定触发了onkeydown事件–相当于一个按键,两个事件,没怎么用过

6.onclick  主要是用于 input type=button,input作为一个按钮使用时的鼠标点击事件

7.onselect  当input里的内容文本被选中后执行,只要选择了就会触发,不是全部选中

8.oninput  当input的value值发生变化时就会触发,(与onchange的区别是不用等到失去焦点就可以触发了)

使用方法:

以上事件可以直接放到input的属性里,例如:

1 ,

可以通过js给input dom元素添加相应的事件,

2 document.getElementByTagName(‘input’).onfocus = function();

3 事件监听。

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

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

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


相关推荐

  • 守护进程管理工具_进程保护工具

    守护进程管理工具_进程保护工具1.文本进程管理工具ntsysv是一个用户管理自动运行的守护进程的文本用户界面工具。2.命令行界面(CLI)工具可以使用chkconfig命令检查,设置系统的各种服务。此命令实际上是通过操作/etc/rc[0-6].d目录下的符号链接文件对系统的各种服务进行管理。chkconfig命令具有如下功能:1.添加指定的新服务2.清除指定的服务3.显示由chkconfig管理的服务4.改变服务的运行级别5…

    2025年6月4日
    2
  • navicat11.0.18激活码【2021免费激活】

    (navicat11.0.18激活码)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html1STL5S9V8F-eyJsaWNlbnNlSW…

    2022年3月27日
    389
  • SpringBoot跨域配置「建议收藏」

    SpringBoot跨域配置「建议收藏」什么是跨域简单而言,跨域请求就是当一台服务器资源从另一台服务器(不同的域名或者端口)请求一个资源或者接口,就会发起一个跨域HTTP请求。举个简单的例子,从http://www.baidu.com,发送一个Ajax请求,请求地址是http://www.taobao.com下面的一个接口,这就是发起了一个跨域请求,在不做任何处理的情况下,显然当前跨域请求是无法被成功请求,因为浏览器基于同源策略会对跨域请求做一定的限制。产生跨域问题的条件例如:http://192.168.38.438:808

    2022年6月25日
    39
  • 数据库建模

    1)定义:在设计数据库时,对现实世界进行分析、抽象、并从中找出内在联系,进而确定数据库的结构,这一过程就称为数据库建模。2)作用:1.模型能准确表达设计意图,更易于进行技术交流。2.模型可以用来高效地生产代码、脚本、技术文档,可以做到“一处改动,多处同步”的效果。3.模型驱动的开发能使开发过程保持一致性,提高开发人员的效率,而且能保持我们的设计模型能被准确的实现而不产生歪曲。

    2022年4月8日
    194
  • navicat15许激活码[最新免费获取]

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

    2022年3月26日
    68
  • Ajax beforeSend和complete 方法

    Ajax beforeSend和complete 方法

    2021年10月9日
    42

发表回复

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

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