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 事件监听。

input获取焦点 原生js_原生js的input事件相关推荐

  1. iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案

    iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案 参考文章: (1)iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案 (2)https://www.cn ...

  2. iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案—scrollIntoView()

    iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案-scrollIntoView() 参考文章: (1)iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案- ...

  3. scrolltop 原生js_解决js页面滚动效果scrollTop在FireFox与Chrome浏览器间的兼容问题的方法...

    最近在做博客的目录功能,发现一个在现代浏览器间的一个bug,或是称之为差异,即页面滚动值(scrollTop)的获取与设定. 在此之前先说一下关于页面元素的坐标获取,这张图的经典性不必再提. 实现滚动 ...

  4. html ios键盘收回后输入框点不动,iOS下Html页面中input获取焦点弹出键盘时挡住input解决方案...

    再次测试,效果如下: 相比于input被挡住,突兀地出现在页面中间更加可以令人接受,但是多次测试,仍然存在问题:当切换输入法的时候,input框的位置会往下移动,被键盘挡住一部分,而且出现的概率比较高 ...

  5. js清除HTML的input数据,js 清空 input file 的值的方法

    今天在做一个利用 JS 上传本地图片的小功能时,需要在文件上传成功后,清空 file 类型的 input 元素中所选择的本地文件,以方便二次功能的调用!而这篇文章飞鸟慕鱼博客就来说一说,如果利用 js ...

  6. js 取得input绑定的datalist中的值_原生JS写一个ToDo Demo

    周六加班没什么事,于是乎...上班摸鱼,用原生JS写了一个ToDo Demo,废话少叙,直接看效果: 如图,实现了以下需求(以下的具体实现我会一一道来): 0.页面的基本布局: 1.rem布局.在不同 ...

  7. 【杂记】(input获取焦点失去焦点、获取input中输入的值、 键盘事件、js事件、Math 属性、手机自适应meta定义、 去掉input内置阴影、图片居中、去蓝色默认背景、点击去掉默认边框)

    1. input获取焦点失去焦点 input:focus{border:1px red solid:} 获取焦点 .focus()失去焦点.blur() 2. 获取input中输入的值 <inp ...

  8. js在input框获取焦点展开,失去焦点隐藏案例

    js在input框获取焦点展开,失去焦点隐藏,点击内层固定,点击外层收缩事件案例: <!DOCTYPE html> <html> <head><title&g ...

  9. JS让input一直获取焦点

    希望只要在失去焦点的时候在调用focus()就可以持续的获取焦点 监听一下 input 元素的 blur 事件就好了: <body><input type="text&qu ...

最新文章

  1. 数字图像处理:图像就是函数的解读
  2. 排优解难 网上邻居常遇故障解决方法
  3. 【正则】匹配html标签里的内容,不含标签
  4. 移动端H5页面注意事项
  5. 电气论文:基于粒子群算法的梯级水火电力系统优化调度【有代码】
  6. 关于 Node.js 应用里使用 winston 进行日志记录的最佳实践
  7. ITPro Magazine2006年第6期发布
  8. rzsz上传下载命令
  9. 十条有用的 Go 技术
  10. 三百行python代码的项目_300行Python代码打造实用接口测试框架
  11. 2.3 The 10-armed Testbed 10摇臂老虎机试验台
  12. Chrome 80 Cookie跨域 Samesite Lax 的错误
  13. 使用keytool工具常用证书转换
  14. 2019年数学建模国赛(国一)经历总结
  15. Skype for Business Client 2016 聊天记录存放公共邮箱
  16. 数据库拆分的理解和案例(详细版)
  17. 「张一鸣」“突袭”「王兴」
  18. b-k-d树 原理 图文解析
  19. 火狐浏览器使用拼写检查
  20. 06-void类型和never类型

热门文章

  1. 如何破解计算机拒绝访问u盘,U盘拒绝访问的解决方法步骤详解
  2. Python通过对象名调用方法(对象名后面括号和参数)
  3. selenium和Firefox的安装配置
  4. 云职教课堂计算机文化基础,智慧职教mooc学院计算机文化基础答案
  5. 苹果iPhone 13系列有望支持息屏显示
  6. 墙都不扶就服你!五面阿里拿下飞猪事业部offer
  7. 缺乏对员工的培训的教训和改进措施
  8. 震惊全网!当美女(类)照镜子竟然...
  9. windows 如何把搜狗输入法作为默认输入法
  10. Xcode中delete键不可用了