项目场景：

做小游戏开发项目时,显示键盘事件event.which方法已弃用，可替换为为KeyboardEvent.key 或者KeyboardEvent.code
虽然不做更改也可以运行,但强迫症看着属实有些难受,而且技术迭代那么快,我们也要随时关注官方更新呀！

问题描述

document.onkeydown = function (event) {console.log(event.which);         //提示“which”已弃用if (event.which == 37 ) {console.log('左'); } else if (event.which == 38) {console.log('上'); } else if (event.which == 39) {console.log('右'); } else if (event.which == 40) {console.log('下'); }}

原因分析：

查看文档后发现keyCode也随之弃用

解决方案：

一、可以替换成event.key方法

document.onkeydown = function (event) {    console.log(event.key); if (event.key == 'ArrowLeft' ) {console.log('左'); } else if (event.key == 'ArrowUp') {console.log('上');               } else if (event.key == 'ArrowRight') {console.log('右');              } else if (event.key == 'ArrowDown' ) {console.log('下');       }}

二、同理可替换为event.code，在此项目中同样适用

document.onkeydown = function (event) {    console.log(event.code); if (event.code == 'ArrowLeft' ) {console.log('左'); } else if (event.code == 'ArrowUp') {console.log('上');               } else if (event.code == 'ArrowRight') {console.log('右');              } else if (event.code == 'ArrowDown' ) {console.log('下');       }}

注意**

code和key获取过来的部分键盘值会有差异，如做判断需要注意混淆

JavaScript——event.which弃用相关推荐

javascript event详解
event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromEleme ...
Javascript Event事件-总结
一.事件类型例如:mouseover鼠标移动到.keydown键盘按下二.事件目标是发生的事件或与之相关的对象,window.document和Element对象是最常见的事件目标三.事件对象 ...
javascript event bubbling and capturing (再谈一谈js的事件冒泡和事件补获，看到这篇文章加深了理解)...
原文地址:http://javascript.info/tutorial/bubbling-and-capturing 先给出最终的结论: Summary Events first are captu ...
试图解释清楚【JavaScript Event Loop】
本篇文章较长,让网络飞一会再看~ 本文结构 - 带着问题看这篇文章 - JS Runtime的几个概念 - Event Loop事件循环 - UI Rendering Task - 可视化:event ...
javascript --- event loop
栗子1 求下面函数的输出 console.log('script start');setTimeout(() => {console.log('setTimeoout'); }, 0);Prom ...
javascript event
event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromEleme ...
一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别
先总结下区别:event.clientX.event.clientY鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性event. ...
javascript Event对象
参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Event Event接口表示在DOM中发生的事件(鼠标,键盘,动画,图片加载,视频暂停等等) ...
javascript Event监听
参考:https://developer.mozilla.org/en-US/docs/Web/API/Element HTML中调用:<button onclick="alert(' ...

JavaScript——event.which弃用

项目场景：

问题描述

原因分析：

解决方案：

一、可以替换成event.key方法

二、同理可替换为event.code，在此项目中同样适用

注意**

JavaScript——event.which弃用相关推荐

最新文章

热门文章