首页 > 其他分享 >js中的键盘事件

js中的键盘事件

时间:2022-11-16 14:11:44浏览次数:41  
标签:key 键位 js 键盘 箭头键 事件 arrow

一. 简单的例子

html中
<textarea id="key"></textarea>

js中
var key = document.getElementById("key")
//选中textarea后,输出回车键,就会在控制台输出"正在验证"
key.onkeydown = function(event) {
  if (event.keyCode == 13){
    console.log("正在验证")
  }
}

常用的键盘事件

onkeydown: 某个键盘按键被按下

onkeyup: 某个键盘按键被松开

onkeypress: 某个键盘按键被按下并松开

其中keycode为键盘事件的属性,包含键盘中对应键位的键值。键位和码值对照表如下

键位 码值 键位 码值
0~9(数字键) 48~57 A~Z(字母键) 65~90
Backspace(退格键) 8 Tab(制表键) 9
Enter(回车键) 13 Space(空格键) 32
Left arrow(左箭头键) 37 Top arrow(上箭头键) 38
Right arrow(右箭头键) 39 Down arrow(下箭头键) 40

标签:key,键位,js,键盘,箭头键,事件,arrow
From: https://www.cnblogs.com/regit/p/16895706.html

相关文章

  • nodejs中事件循环中的执行顺序
    nodejs事件循环是一个典型的生产者/消费者模型,异步I/O、网络请求等是事件的生产者,源源不断为Node提供不同类型的事件,这些事件被传递到对应的观察者那里,事件循环则从观......
  • 「Node.js」“寓教于乐”的学习记录
    前言我个人更喜欢边学边实际编写功能,但是限于对Node的接触较少,所以我转而求助于大佬的文章,这些优秀的文章中有些是写具体功能实现。于是我便开启一段欢乐的学习之旅。参考文......
  • js定义函数的三种方法及区别
    1函数定义:2functiontest(){};3函数表达式|匿名函数4vartest=function(){};5构造函数6vartest=newFunction('a','b','函数体');functio......
  • npm install提示request to https://registry.npmjs.org/vue-cli failed, reason: con
    错误如下npmERR!codeETIMEDOUTnpmERR!syscallconnectnpmERR!errnoETIMEDOUTnpmERR!networkrequesttohttps://registry.npmjs.org/vue-clifailed,reas......
  • Node.js的crypto模块,crypto加密算法
    1、安装2、使用//通过crypto.createHash()函数,,创建一个hash实例,但是需要调用md5,sha1,sha256,sha512算法来实现实例的创建。crypto.createHash();//创建hash实例letsha1......
  • 2022-11-16 Unexpected end of JSON input
    vue+小程序,页面传参中的url路径有问题,导致传递过去后使用json.parse报错如题所示。原因:url中含有特殊字符无法被传递。解决方案:使用encodeURIComponent把参数编码,然后再......
  • 通俗易懂的React事件系统工作原理
    前言React为我们提供了一套虚拟的事件系统,这套虚拟事件系统是如何工作的,笔者对源码做了一次梳理,整理了下面的文档供大家参考。在React事件介绍中介绍了合成事件对象以......
  • node.js & npm version not match bug
    node.js&npmversionnotmatchbughttps://github.com/web-full-stack/nextjs-ssr/issues/7refs©xgqfrms2012-2020www.cnblogs.com/anonymous007发布文......
  • 在jsp页面int和String类型的相互转换
    浅浅地来做一个对比吧!.java文件int转成string类型:Strings=String.valueOf(intm);String转成int类型:intm=Integer.parseInt(Strings);.jsp页面中进行int和String类......
  • Next.js & React component render twice bug All In One
    Next.js&ReactcomponentrendertwicebugAllInOneerror❌solution✅//next.config.jsmodule.exports={-reactStrictMode:true,+reactStrictMode:......