按下键后，更改kbd标签元素的背景颜色，然后恢复为原始颜色

问题描述

我试图在按下键时更改KBD标签颜色，然后又恢复为原始颜色，但是我的代码似乎对浏览器没有效果。

代码如下：

document.addEventListener("keydown",function(event) {
  if (event.code=="KeyA") {
    let audio1=new Audio("piano_A.mp3");
    audio1.play();
    highlight("A");
  }
  else if (event.code=="KeyS") {
    let audio2=new Audio("piano_B.mp3");
    audio2.play();
    highlight("S")
  }
  else if(event.code=="KeyD") {
    let audio3=new Audio("piano_C_sharp.mp3");
    audio3.play() highlight("D")
  }
  else if(event.code=="KeyF") {
    let audio4=new Audio("piano_D.mp3");
    audio4.play()
  }
  else if(event.code=="KeyG") {
    let audio5=new Audio("piano_E.mp3");
    audio5.play()
  }
  else if(event.code=="KeyH") {
    let audio6=new Audio("piano_F.mp3");
    audio6.play()
  }
  else if(event.code=="KeyJ") {
    let audio7=new Audio("piano_G.mp3");
    audio7.play()
  }
  else {
    console.log("Press only the following keys: A S D F G H J") let str="Press only the following keys: A S D F G H J" document.getElementById("intro").innerHTML=str.blink(); // not blinking
  }
}

);
function highlight(id) {
  let obj=document.getElementById(id);
  let orig=obj.style.backgroundColor;
  obj.style.backgroundColorcolor='#FFFF99';
  setTimeout(function() {
    obj.style.color=orig;
  },1010);
}

当我按下按键时，效果没有显示在浏览器中

解决方法

用事件的实际代码号更改事件代码键。另外，将event.code更改为event.keyCode。

document.addEventListener("keydown",function(event) {
  if (event.keyCode==65) {
    let audio1=new Audio("piano_A.mp3");
    audio1.play();
    highlight("A");
  }
  else if (event.keyCode==83) {
    let audio2=new Audio("piano_B.mp3");
    audio2.play();
    highlight("S")
  }
  else if(event.keyCode==68) {
    let audio3=new Audio("piano_C_sharp.mp3");
    audio3.play();
    highlight("D")
  }
  else if(event.keyCode==70) {
    let audio4=new Audio("piano_D.mp3");
    audio4.play();
  }
  else if(event.keyCode==71) {
    let audio5=new Audio("piano_E.mp3");
    audio5.play();
  }
  else if(event.keyCode==72) {
    let audio6=new Audio("piano_F.mp3");
    audio6.play();
  }
  else if(event.keyCode==74) {
    let audio7=new Audio("piano_G.mp3");
    audio7.play();
  }
  else {
    console.log("Press only the following keys: A S D F G H J") let str="Press only the following keys: A S D F G H J" document.getElementById("intro").innerHTML=str.blink(); // not blinking
  }
}

);
function highlight(id) {
  let obj=document.getElementById(id);
  let orig=obj.style.backgroundColor;
  obj.style.backgroundColor = '#FFFF99';
  setTimeout(function() {
    obj.style.backgroundColor = orig;
  },1010);
}

,

Blockquote 我只是意识到问题出在哪里....一直在我面前....

obj.style.backgroundColorcolor ='＃FFFF99';

我是这样做的。...不确定为什么发布代码时是正确的