js中onkeydown onkeypress 和onkeyup的区别

xioqua 发布于2019-08-19 18:34 / 1603人阅读

摘要：系统按钮例如，箭头键和功能键无法得到识别。关于事件响应事件响应的时候输入的字符并没有被系统接受，而响应的时候，输入流已经被系统接受。参考中与的区别对象

在查看js event时看到这三个事件，随手Google了一下，和自己之前理解的有些出入，记录下来以方便后期需要时查询。

一、msdn上关于三者的说明

onkeydown

这个事件在用户按下任何键盘键（包括系统按钮，如箭头键和功能键）时发生。

onkeypress

这个事件在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。

onkeyup

这个事件在用户放开任何先前按下的键盘键时发生.

二、区别

关于执行顺序

测试发现onkeydown 事件最先执行，其次是onkeypress,最后是onkeyup；onkeydown 和onkeypress会影响onkeyup的执行。三个事件同事在的话，都是alert的话，只会弹出2个alert，up事件的alert不会弹出。

关于事件响应

onkeydown 、onkeypress事件响应的时候输入的字符并没有被系统接受，而响应onkeyup的时候，输入流已经被系统接受。

onkeydown 触发的时候输入流正要进入系统，也就是说onkeydown 事件一完，输入流就进入了系统，无法改变。所以通过onkeydown 事件可以改变用户是按了哪个键；而onkeypress事件则是在输入流进入系统后触发的，但输入流暂未被系统处理，此时已经不能改变输入流了；onkeyup则是输入流被系统处理后发生的。

参考

1、js中onkeyup、onkeydown与onkeypress的区别
2、HTML DOM Event 对象

云服务器 GPU云服务器 js和javascript的区别 js数据对象和对象的区别吗 js中数据和对象的关系图 js中函数和类

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/79718.html

动态监听输入框值的变化

摘要：以上事件是键盘事件，但是当使用作为监听事件时，会发现一些复制粘贴等操作用不了。二输入框事件和都是事件对象，当输入框的值发生改变时触发该事件。不同的是，是在值改变时立即触发，而是在值改变后失去焦点才触发，并且可以用在非输入框中，如等。一、键盘事件 1.onkeydownonkeydown 事件会在用户按下一个键盘按键时发生。2.onkeypress onkeypress 事件会在键盘按...

missonce 2019-08-26 11:58 评论0 收藏0
DOM事件

摘要：语法事件执行脚本在元素上绑定事件。最后这个布尔值参数如果是，表示在捕获阶段调用事件处理程序如果是，表示在冒泡阶段调用事件处理程序。注：部分参考来源：JavaScript 高级程序设计（第3版）注：部分参考来源：慕课网什么是事件事件就是文档或浏览器窗口中发生的一些特定的交互瞬间。事件流事件流描述的是从页面中接收事件的顺序。 IE的事件流是事件冒泡流。 Netscape Com...

DDreach 2019-08-23 17:16 评论0 收藏0
原生input和onchange

摘要：简单是中输入值可以输多个，类似还是觉得让用户选，比用户输合适不过没办法，开始做。是的专属属性，以下不支持。直接使用就行代码填充内容参考文章总结与事件的用法和区别简单是：input中输入id值(可以输多个，类似12,13,14) ps: 还是觉得让用户选，比用户输合适不过没办法，开始做。先认识一下原生的onchange，其实际意义并不是输入改变就会监听到，而是onchange事件只在...

张率功 2019-08-20 19:03 评论0 收藏0
js--DOM事件绑定

摘要：中的事件绑定函数和可能在实践中不去使用，有几个原因就将全面支持中的事件绑定函数的事件绑定函数无法传递的事件绑定函数不支持捕获同一个函数注册绑定后，没有屏蔽掉有内存泄漏的问题 js事件绑定 JavaScript 有三种事件模型：内联模型脚本模型 DOM2 模型内联模型 //基本废除不用脚本模型 //基本不用 var input = document.getE...

tianhang 2019-08-26 11:50 评论0 收藏0