js监听键盘事件的方法_原生和jquery的区别详解
作者：jingxian 发布时间：2024-07-19 21:47:30
标签：js,监听,键盘,事件
经常需要监听键盘的事件，以便做更好的操作，基本原理是：监听全局键盘，每一个键盘，当用户按下某一按键时，返回对应的键值，然后再判断用户按下了哪一科按键，键值对应按键的名称在最下面列出，自行比对。去以下介绍两种不同的方式
原生键盘监听事件：按下一次按键，分为三个过程，按下—按住—松开
onkeydown：某个键被按下
onkeypress：某个键盘的键被按下或按住
onkeyup：某个键盘的键被松开
使用方法，一般来说，键盘监听是直接在整个页面文档上进行监听的，也就是document上
以下是原生的使用案例
//实际使用
document.onkeydown=function(e){ //对整个页面文档监听
var keyNum=window.event ? e.keyCode :e.which; //获取被按下的键值
//判断如果用户按下了回车键（keycody=13）
if(keyNum==13){
alert('您按下了回车');
}
//判断如果用户按下了空格键(keycode=32)，
if(keyNum==32){
alert('您按下了空格');
}
剩下另外两个按键方法同理
jquery的方式监听键盘事件
jquery的也分为三个过程，但是在事件名称上有所不同
keyup：某个键盘的键被松开
keydown：某个键被按下
keypress：某个键盘的键被按下或按住
使用方法：
$(document).keyup(function(event){
switch(event.keyCode) {
case 27:
alert('您按下了回车');
return;
case 13:
alert('您按下了空格');
return;
}
});
小总结：总体来说，这两种方式达到的效果都是一样的，只是由于jquery的获取对象更加简单，所以一般更推介使用jquery，当然，如果你有jquery基础的话。
0
投稿猜你喜欢
- python中向上取整可以用ceil函数，ceil函数是在math模块下的一个函数。向上取整需要用到 math 模块中的 ceil() 方法
- 需求在某应用中，需要根据一定的规则生成随机的IP地址，规则类似于192.168.11.0/24这样的CIDR形式给出。实现经过艰苦卓绝的调试
- Application Name（应用程序名称）：应用程序的名称。如果没有被指定的话，它的值为.NET SqlClient Data Pro
效果如图 一、获取天气def getWeather1(city): try:- 离散特征的编码分为两种情况：1、离散特征的取值之间没有大小的意义，比如color：[red,blue],那么就使用one-hot编码2、离散
- 前言select作为Go chan通信的重要监听工具，有着很广泛的使用场景。select的使用主要是搭配通信case使用，表面上看，只是简单
- 常见的协议http和httpshttp协议：超文本传输协议，是一个发布和接受HTML页面的方法，端口是80https 协议：http协议的加
- 外联接。外联接可以是左向外联接、右向外联接或完整外部联接。 在 FROM 子句中指定外联接时，可以由下列几组
- 1. 在Python中使用中文在Python中有两种默认的字符串：str和
- 间类型：尽量使用TIMESTAMP类型，因为其存储空间只需要 DATETIME 类型的一半。对于只需要精确到某一天的数据类型，建议使用DAT
- 下表列出了所有Python语言支持的算术运算符。假设变量a持有10和变量b持有20，则： 例子:试试下面的例子就明白了所有的Pyt
- ...mapstate和...mapgetters的区别…mapstate当一个组件需要获取多个状态时候，将这些状态都
- 1在配置文件中添加skip-grant-tables后重启mysql，然后直接登录[root@tyjs09 ~]# cat /etc/my.
- 本文实例讲述了Thinkphp 框架基础之源码获取、环境要求与目录结构。分享给大家供大家参考，具体如下：获取ThinkPHP获取ThinkP
- Bootstrap 轮播（Carousel）插件是一种灵活的响应式的向站点添加滑块的方式。0x01 基本实例Bootstrap实现轮播幻灯片
- 前言如果一个类是别人编写的，又没有帮助文档，怎么样来查看所有成员函数呢？本文详细给大家介绍了关于python用dir函数查看类中所有成员函数
- 最近要做个从 pdf 文件中抽取文本内容的工具，大概查了一下 python 里可以使用 pdfminer 来实现。下面就看看怎样使用吧。PD
- 1、安装PyInstallerPyInstaller的作用如标题所说，首先需要下载PyInstaller和UPX，UPX是用来压缩exe的，
- substr --- 取得部份字符串 语法 : string substr (string string, int start [, int
- vue中form data形式传参vue项目中form data形式传参，需要在headers中添加如下代码headers: {
