[TimLinux] JavaScript input框的onfocus/onblur/oninput/onchange事件介绍
1. onfocus事件
input框获取到焦点时,触发了该事件,比如获取到焦点时,修改input框的背景色。这个功能其实可以使用css的伪类:focus来定义。
2. onblur事件
这个与onfocus事件想法,当input框失去焦点时,触发该事件,比如将输入的文本,统一修改为小写
3. onchange事件
这个事件的发生需要具有2个条件:
- 失去焦点
- 内容发生了变化
4. oninput事件
这个时HTML5新加入的事件,IE9之前是不支持的,在IE9之前使用的是: onpropertychange事件,这个事件,用来做实时搜索功能非常的合适。当输入框内容有变化时,实时触发事件,比如输入了一个字符、或者删除了一个字符,都将触发该事件的发生。
5. 示例
事件比较简单,不单独给出示例了,大家可以到网上针对每一个事件,单独搜索示例吧!
[TimLinux] JavaScript input框的onfocus/onblur/oninput/onchange事件介绍的更多相关文章
- JS事件 文本框内容改变事件(onchange)通过改变文本框的内容来触发onchange事件,同时执行被调用的程序。
文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...
- JavaScript input框输入实时校验
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- JS改变input的value值不触发onchange事件解决方案 (转)
方法(一)(转载的网络资料) 需要了解的知识 首先,我们需要了解onchange和onpropertychange的不同: IE下,当一个HTML元素的属性改变的时候,都能通过 onprope ...
- [TimLinux] JavaScript 模态框可拖动功能实现——jQuery版
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- [TimLinux] JavaScript 模态框可拖动功能实现——节流版
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- [TimLinux] JavaScript 模态框可拖动功能实现——原始版
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- input框输入完回车即可查询事件
简单有效的方法,随笔记录一下在html设置id <input id="search_sim" type="text" class="form-c ...
- 使用input file上传文件中onChange事件只触发一次问题
每次上传文件的时候,都会将当前的文件路径保存至$event.target.value中,当第二次选择文件时,由于两次$event.target.value相同,所以不会触发change事件. 解决方案 ...
- IE10 解决input file 同一文件不触发onchange事件
if (window.ActiveXObject) { var reg = /10\.0/; var str = navigator.userAgent; if (reg.test(str)) { v ...
随机推荐
- 怎样判断有没有SQL注入漏洞及原理?
来源:实验楼 最为经典的单引号判断法: 在参数后面加上单引号,比如: http://xxx/abc.php?id=1' 如果页面返回错误,则存在 Sql 注入. 原因是无论字符型还是整型都会因为单引号 ...
- [Office] Resources for Office Development
Office 2013 Document (.chm) download page: http://www.microsoft.com/en-us/download/details.aspx?id=4 ...
- Python3.7.1学习(六)RabbitMQ在Windows环境下的安装
Windows下安装RabbitMQ 环境配置 部署环境 部署环境:windows server 2008 r2 enterprise(本文安装环境Win7) 官方安装部署文档:http://www. ...
- linux下制作linux系统盘(光盘、U盘)
cdrecord制作启动光盘 首先cdrecord -scanbus输出设备列表和标识,(我的此次为5,0,0) [ˈrekərd] 然后用cdrecord -v dev=5,0,0 -eject ...
- 【MongoDB】2019年MongoDB中文社区广州大会,干货满满的分享活动
1 介绍 MongoDB中文社区(mongoing.com)是大中华区获得官方认可的中文社区,11月23日下午,在广州举办了线下用户大会,带给大家一手干货和实践. 2 大会议程 大会组织者对时间的把控 ...
- 关于Java 值传递深度分析
首先说观点:java只有值传递没有引用传递 然后再来看看值传递与引用传递两者的定义 值传递(pass by value)是指在调用函数时将实际参数复制一份传递到函数中,这样在函数中如果对参数进行修改, ...
- Mac上安装并配置JDK
1,下载 点击 官网 ,进入下载界面, 同意协议内容 找到对应的Mac版本, 2,安装 安装下载下来的文件,期间会要求输入一次电脑密码,然后自动安装完. 如果显示文件已经损坏,打开 终端 输入 sud ...
- git操作忽略.iml文件
git操作忽略.iml文件** 参考:https://blog.csdn.net/m0_38001814/article/details/87354584 因为.iml文件的修改导致代码pull失败 ...
- FIddler+Proxifer工具对windows PC客户端进行抓包
python的大火,带动了python爬虫. 爬虫就必定绕不开抓包. 目前最常见的就是网页抓包了,可以使用chrome进行,或者配合其他抓包软件 fiddler. 小程序有些兴起是,如跳一跳之类的,也 ...
- Alibaba Nacos 学习(五):K8S Nacos搭建,使用nfs
Alibaba Nacos 学习(一):Nacos介绍与安装 Alibaba Nacos 学习(二):Spring Cloud Nacos Config Alibaba Nacos 学习(三):Spr ...