html5响应键盘事件,JavaScript键盘事件响应顺序详解

本文详细介绍了JavaScript中键盘事件的响应顺序,对于字符键,顺序为keydown->keypress->keyup;对于非字符键,顺序为keydown->keyup。文中通过实例展示了如何监听并输出这些事件,帮助理解键盘事件的工作机制。
摘要由CSDN通过智能技术生成

本文实例为大家分享了JavaScript键盘事件响应顺序的具体实现代码,供大家参考,具体内容如下

键盘响应顺序

当按下键盘时,会触发多个事件,它们将按顺序发生。

对于字符键来说,键盘事件的影响顺序如下:

1.keydown

2.keypress

3.keyup

对于非字符键(如功能键或特殊键)来说,键盘事件的响应顺序如下:

1.keydown

2.keyup

如果按下字符键不放,则keydown和keypress事件将逐个发生,直至松开按键。

如果按下非字符键不放,则只有keydown事件持续发生,直至松开按键。

示例:获取键盘事件响应顺序:

var n = 1;

var text = document.getElementById("text");

text.onkeydown = f;

text.onkeyup = f;

text.onkeypress = f;

function f(e){

var e = e || window.event;

text.value += (n++) + "=" + e.type + " (keyCode=" + e.keyCode + ")\n";

}

输入abc

3d82960c78ee17c0d4a91fe58858cdc2.png

分别输入Shift、Ctrl、Alt功能键

f173a28643082d65dc4a2dd14339eb6f.png

连续按下字符a

f4b600d9031753714ff1567f33392bb9.png

连续按下Shift

3b8bb2a2c1c669bfea8f4ec673aef341.png

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值