当前位置: 首页 > news >正文

js keyup、keypress和keydown事件 详解

 js keyup、keypress和keydown事件  详解

js keyup、keypress和keydown事件都是有关于键盘的事件

当一个按键被pressed 或released在每一个现代浏览器中,都可能有三种客户端事件。

  1. keydown event
  2. keypress event
  3. keyup event

keydown事件发生在键盘的键被按下的时候,接下来触发keypress事件。 keyup 事件在按键被释放的时候触发。

这三个事件在页面中的使用方法如下例:

<input id="testkeyevent" name="testkeyevent"  onKeyUp="keyup()" />

<input id="testkeyevent" name="testkeyevent"   onkeypress="keypress()" />

<input id="testkeyevent" name="testkeyevent"   onkeydown="keydown()" />

 

对应的js函数:

function keyup(){ ...}

function keypress(){ ...}

function keydown(){ ...}

 

注意:

  1. KeyDown触发后,不一定触发KeyUp,当KeyDown 按下后,拖动鼠标,那么将不会触发KeyUp事件。
  2. KeyPress主要用来捕获数字(注意:包括Shift+数字的符号)、字母(注意:包括大小写)、小键盘等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜单键}、{开始键}和方向键外的ANSI字符
  3. KeyDown 和KeyUp 通常可以捕获键盘除了PrScrn所有按键(这里不讨论特殊键盘的特殊键)
  4. KeyPress 只能捕获单个字符
  5. KeyDown 和KeyUp 可以捕获组合键。
  6. KeyPress 可以捕获单个字符的大小写
  7. KeyDown和KeyUp 对于单个字符捕获的KeyValue 都是一个值,也就是不能判断单个字符的大小写。
  8. KeyPress 不区分小键盘和主键盘的数字字符。
  9. KeyDown 和KeyUp 区分小键盘和主键盘的数字字符。
  10. 其中PrScrn 按键KeyPress、KeyDown和KeyUp 都不能捕获。
  11. 在使用键盘的时候,通常会使用到CTRL+SHIFT+ALT 类似的组合键功能。对于此,我们如何来判定?

         通过KeyUp 事件能够来处理(这里说明一下为什么不用KeyDown,因为在判定KeyDown的时候,CTRL、SHIFT和ALT 属于一直按下状态,然后再加另外一个键是不能准确捕获组合键,所以使用KeyDown 是不能准确判断出的,要通过KeyUp 事件来判定 )

         这里简单的列举出CTRL+其它键的组合判定代码:


    private void Form3_KeyUp(object sender, KeyEventArgs e)
    {
    if (e.Control)
    {
    MessageBox.Show("KeyUp:Ctrl+" + e.KeyValue.ToString());
    }
    }
  12. 捕获PrScrn按键事件

     通过一种钩子的方式可以判定PrScrn 按键事件,钩子可以获取任何键盘事件。

以下是一些键盘上的键对应的Code:以下是一些键盘上的键对应的Code:

  键盘按键                          对应的数码

backspace8
tab9
enter13
shift16
ctrl17
alt18
pause/break19
caps lock20
escape27
page up33
Space32
page down34
end35
home36
arrow left37
arrow up38
arrow right39
arrow down40
insert45
delete46
048
149
250
351
452
553
654
755
856
957
a65
b66
c67
d68
e69
f70
g71
h72
i73
j74
k75
l76
m77
n78
o79
p80
q81
r82
s83
t84
u85
v86
w87
x88
y89
z90
left window key91
right window key92
select key93
numpad 096
numpad 197
numpad 298
numpad 399
numpad 4100
numpad 5101
numpad 6102
numpad 7103
numpad 8104
numpad 9105
multiply106
add107
subtract109
decimal point110
divide111
f1112
f2113
f3114
f4115
f5116
f6117
f7118
f8119
f9120
f10121
f1

相关文章:

  • 云栖问答送的淘公仔收到啦
  • struts2自己定义类型转换器
  • DJANGO的requirements的运用
  • 糖葫芦照样吃
  • RESTful三理解
  • 春运学生与民工
  • c11通过share_from_this构造另一类对象抛异常
  • (轉貼) 蒼井そら挑戰筋肉擂台 (Misc)
  • php底层开发框架, yaf,swoole,hiphop
  • 《仙剑奇侠传4》仙剑问答全答案
  • URL介绍及处理
  • (轉貼) 資訊相關科系畢業的學生,未來會是什麼樣子?(Misc)
  • 半平面交模板
  • 观察站模式
  • Fiddler 抓包工具总结
  • #Java异常处理
  • 2017前端实习生面试总结
  • Docker 笔记(2):Dockerfile
  • download使用浅析
  • ES10 特性的完整指南
  • JS学习笔记——闭包
  • learning koa2.x
  • 初识MongoDB分片
  • 工作手记之html2canvas使用概述
  • 关于 Cirru Editor 存储格式
  • 观察者模式实现非直接耦合
  • 基于Vue2全家桶的移动端AppDEMO实现
  • 前端攻城师
  • 什么软件可以剪辑音乐?
  • 微服务核心架构梳理
  • 3月27日云栖精选夜读 | 从 “城市大脑”实践,瞭望未来城市源起 ...
  • ​LeetCode解法汇总2304. 网格中的最小路径代价
  • ​软考-高级-系统架构设计师教程(清华第2版)【第12章 信息系统架构设计理论与实践(P420~465)-思维导图】​
  • #、%和$符号在OGNL表达式中经常出现
  • #Linux(make工具和makefile文件以及makefile语法)
  • #QT(串口助手-界面)
  • ${ }的特别功能
  • (4)STL算法之比较
  • (超简单)使用vuepress搭建自己的博客并部署到github pages上
  • (二)斐波那契Fabonacci函数
  • (力扣题库)跳跃游戏II(c++)
  • (一)python发送HTTP 请求的两种方式(get和post )
  • (轉貼) UML中文FAQ (OO) (UML)
  • .gitignore文件---让git自动忽略指定文件
  • .mkp勒索病毒解密方法|勒索病毒解决|勒索病毒恢复|数据库修复
  • .Net 4.0并行库实用性演练
  • .NET DataGridView数据绑定说明
  • .NET LINQ 通常分 Syntax Query 和Syntax Method
  • .NET 材料检测系统崩溃分析
  • .net 写了一个支持重试、熔断和超时策略的 HttpClient 实例池
  • .NET/C# 中设置当发生某个特定异常时进入断点(不借助 Visual Studio 的纯代码实现)
  • .NET6 命令行启动及发布单个Exe文件
  • .NetCore Flurl.Http 升级到4.0后 https 无法建立SSL连接
  • .NET中的Event与Delegates,从Publisher到Subscriber的衔接!
  • ??在JSP中,java和JavaScript如何交互?