Question

目前我有：

is1Pressed = false,
is2Pressed = false,
is3Pressed = false,
is4Pressed = false,
is5Pressed = false,
is6Pressed = false,
p = document.getElementById('p');

function loop() {
  if(is1Pressed == true){
    console.log("1");
    p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else if(is2Pressed == true) {
    console.log=("2");
    p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else if(is3Pressed == true) {
   p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else if(is4Pressed == true) {
   p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else if(is5Pressed == true) {
   p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else 
  {
    p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }

}

document.addEventListener('keydown', function (e) {
  switch (e.keyCode) {
    // 1
  case 49:
    is1Pressed = true;
    break;
    // 2
  case 50:
    is2Pressed = true;
    break;
    // 3 
  case 51:
    is3Pressed = true;
    break;
    // 4
  case 52:
    is4Pressed = true;
    break;
    // 5
  case 53:
    is5Pressed = true;
    break;
    //6      
  case 54:
    is6Pressed = true;
    break;
  }
}, false);

document.addEventListener('keyup', function (e) {
  switch (e.keyCode) {
    // 1
  case 49:
    is1Pressed = false;
    break;
    // 2
  case 50:
    is2Pressed = false;
    break;
    // 3 
  case 51:
    is3Pressed = false;
    break;
    // 4
  case 52:
    is4Pressed = false;
    break;
    // 5
  case 53:
    is5Pressed = false;
    break;
    //6      
  case 54:
    is6Pressed = false;
    break;

  }
}, false);

var framesPerSecond = 60,
  intervalId = setInterval(loop, framesPerSecond / 1000);

但是，当我按下1键播放样本声音时，“1”的console.log运行并且声音永远不会初始化。我究竟做错了什么？此外，当页面处于非活动状态时，声音循环。

Answer 1

对不起，我不知道出了什么问题，虽然我确实注意到所有不同的if / else情况都尝试播放相同的声音，而最后的情况下即使没有按下按键也会发出声音（或者如果这些声音对你有效，那就好了。

loop()函数的当前结构意味着（如果它有效）一次只能播放一个声音，那么为什么要跟踪与keyup和keydown处理程序同时按下哪些键？您可能只是使用键盘来停止所有声音，然后在keydown中启动与任何按键一起按下的声音 - 我假设您的意图是只要按下按键就让声音继续前进。

所以：

var currentKey = 0,
    p = document.getElementById('p');

document.addEventListener('keydown', function (e) {
  var key = e.keyCode-48;

  if (currentKey != key)
     p.innerHTML = "<audio autoplay='autoplay' src='button" + key + ".wav'/>";

  currentKey = key;
}, false);

document.addEventListener('keyup', function (e) {
  p.innerHTML = "";
  currentKey = 0;
}, false);

无论如何，如果你想尝试或多或少地使用当前的机制，你可以通过删除keyup / down处理程序中的所有单独的键标志和switch语句并使用单个对象来稍微整理你的代码保持所有键的状态：

var keyState = {},
    p = document.getElementById('p');

document.addEventListener('keydown', function (e) {
  keyState[e.keyCode-48] = true;
}, false);

document.addEventListener('keyup', function (e) {
  keyState[e.keyCode-48] = false;
}, false);

function loop() {
  if(keyState["1"]){
    console.log("1");
    p.innerHTML = "<audio autoplay='autoplay' src='button1.wav'/>";
  }
  else if(keyState["2"]) {
    console.log=("2");
    p.innerHTML = "<audio autoplay='autoplay' src='button2.wav'/>";
  }
  else if(keyState["3"]) {
   p.innerHTML = "<audio autoplay='autoplay' src='button3.wav'/>";
  }
  else if(keyState["4"]) {
   p.innerHTML = "<audio autoplay='autoplay' src='button4.wav'/>";
  }
  else if(keyState["5"]) {
   p.innerHTML = "<audio autoplay='autoplay' src='button5.wav'/>";
  }
  else if(keyState["6"]) {
  {
    p.innerHTML = "<audio autoplay='autoplay' src='button6.wav'/>";
  }
  else {
    p.innerHTML = "";
  }    
}

var framesPerSecond = 60,
  intervalId = setInterval(loop, framesPerSecond / 1000);

使用键播放声音Js

1 个答案: