键盘事件之keydown keypress keyup区别
经过测试,显然事件执行的顺序是: keydown->keypress->keyup.
但是连续按一个按键的话,会一直触发:keydown keypress。直到你提起按键,会触发keyup。
但是对一些特殊的键子,各个事件在浏览器里能触发的事件并不一样。
有几点需要注意:
1.像keypress对: shift ctrl 上下键等非字符的输入不会触发。
2.在enter键遇到form表单的时候,当只有一个文本框里并且输入ENTER的时候,form表单会自动提交,这时候只会触发keydown,keypress两个事件。
3.当监听keydown事件,enter键遇到form表单并且target='_blank'的时候有些浏览器会拦截页面,原因是:
因为keydown在按下回车的时候已经触发,但这时程序还在处理逻辑,在处理完提交的时候,浏览器会认为是程序打开的新页面,不认为是用户行为打开的,导致浏览器拦截新页面的打开,解决办法是:把监听keydown换成监听keypress。
总结:
keydown 从表现上来看是按下任意键。按下的字符,如果是文本框的话还没有显示到文本框之前就产生的事件。keydown只要按下一个键就会触发。
keypress 就是在松开按键时发生,此时字符已经输入到文本框。要按下并松开并有输入性字符的按键才会触发。
键盘事件之keydown keypress keyup区别的更多相关文章
- 部分无线终端不响应键盘事件(keydown,keypress,keyup)的解决办法
		在无线侧实现搜索显示smartbox功能的时候,会对输入框绑定keydown.keyup.keypress事件,从而在检测到输入框的值发生改变时,发出请求拉取smartbox的内容. 但是,在iPho ... 
- keyDown keyPress keyUp  事件的区别
		keyDown keyPress keyUp 事件的区别 一 触发顺序 显而易见,事件发生的顺序是: keydown --> keypress --> keyup 当按住一个键一段时间后 ... 
- keydown - > keypress - > keyup  用法和区别
		英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chr ... 
- keydown,keypress,keyup三者之间的区别
		最近看了Javascript高级教程中对过滤输入的介绍,想实现比如电话号码中不能包好非数值的字符,而相应文本中插入字符的操作是keypress事件,所以就想通过阻止这个事件的默认事件行为来阻止这个事件 ... 
- Vue2键盘事件:keydown/keyup...
		Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ... 
- keydown - > keypress - > keyup
		英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chr ... 
- vue学习笔记(一)关于事件冒泡和键盘事件 以及与Angular的区别
		一.事件冒泡 方法一.使用event.cancelBubble = true来组织冒泡 <div @click="show2()"> <input type=&q ... 
- 关于事件冒泡和键盘事件 以及与Angular的区别
		一.事件冒泡 方法一.使用event.cancelBubble = true来组织冒泡 <div @click="show2()"> <input type=&q ... 
- 无线端不响应键盘事件(keydown,keypress,keyup)
		今天在项目时,在android手机上使用输入法的智能推荐的词的话,不会触发keyup事件,一开始想到在focus时使用一个定时器,每隔100ms检测输入框的值是否发生了改变,如果改变了就作对应的处理, ... 
随机推荐
- CHARINDEX (Transact-SQL)
			SQL Server 2014 其他版本 2(共 3)对本文的评价是有帮助 - 评价此主题 在一个表达式中搜索另一个表达式并返回其起始位置(如果找到). Transact-SQL 语法约定 语法 ... 
- Oracle学习(十):视图,索引,序列号,同义词
			1.知识点:能够对比以下的录屏进行阅读 视图,序列,索引,同义词 SQL> --视图:虚表 SQL> --视图的长处:简化复杂查询.限制数据訪问(银行用的多).提供数据的相互独立.相同的数 ... 
- 简单实现div+css页面自适应
			Step1.在<head>添加如下代码<meta name="viewport" content="width=device-width, initia ... 
- 在EasyUI中统一判断是否有选中行,如果有则将选中行数据传入回调函数
			function procossWithSeletedData(func) { var rowData = $("#tbGrid").datagrid("getSelec ... 
- java static关键字
			方便在没有创建对象的情况下来进行调用(方法/变量). 很显然,被static关键字修饰的方法或者变量不需要依赖于对象来进行访问,只要类被加载了,就可以通过类名去进行访问. static可以用来修饰类的 ... 
- 菜单之二:使用xml文件定义菜单
			参考<疯狂android讲义>2.10节 P174,参见归档project:XmlMenuDemo.zip 一般推荐使用XML文件定义菜单. 基本步骤如下: 1.定义布局文件 为简单显示原 ... 
- Windows下Redis的安装
			1.安装Redis 官方网站:http://redis.io/ 官方下载:http://redis.io/download 可以根据需要下载不同版本 windows版:https://github.c ... 
- Fiddler 域名过滤
			原来一直没意识到Fiddler过滤,导致每次抓包都要自己判断.搜索好多东西,真是呵呵! 过滤设置很简单,看懂一张图就解决问题了. 箭头 那两处设置下,圆圈处保存再进行抓包即可 
- 安装apk到虚拟的device
			adb device 显示你的设备 adb install apk包 
- asp.net 获取当月的第一天和最后一天示例
			DateTime now = DateTime.Now; DateTime d1 = ); DateTime d2 = d1.AddMonths().AddDays(-); d1是本月的第一天,d2本 ... 
