在JavaScript中释放键时,如何停止声音

在JavaScript中释放键时,如何停止声音,javascript,html,Javascript,Html,我正在为我和我的朋友(我知道有点笨)编写一个全空气喇叭钢琴的代码,我开始做所有的键绑定,然后我遇到了这个问题,当我松开按键激活它时,声音不会停止 以下是到目前为止我在.js文件中看到的内容(到目前为止只输入了一个声音): 函数startanutural(){ var A=新音频(“一个自然的.mp3”); A.玩(); } 函数stopAnatural(){ var A=新音频(“一个自然的.mp3”); A.暂停(); A.currentTime=0;; } document.onkeydo

我正在为我和我的朋友(我知道有点笨)编写一个全空气喇叭钢琴的代码,我开始做所有的键绑定,然后我遇到了这个问题,当我松开按键激活它时,声音不会停止

以下是到目前为止我在.js文件中看到的内容(到目前为止只输入了一个声音):

函数startanutural(){
var A=新音频(“一个自然的.mp3”);
A.玩();
}
函数stopAnatural(){
var A=新音频(“一个自然的.mp3”);
A.暂停();
A.currentTime=0;;
}
document.onkeydown=函数(e){
e=e | | window.event;
var key=e.which | e.keyCode;
如果(键===81){
startanutural();
}
};
document.onkeyup=函数(e){
e=e | | window.event;
var key=e.which | e.keyCode;
如果(键===81){
stopAnatural();
}

};您正在创建同一声音的新实例并将其暂停,同时原始实例继续播放

相反,这两个函数都需要引用相同的
音频
对象

也许这样的设计更适合你

function createSound(file) {
  var sound = new Audio(file);

  return {
    start: function() {
      sound.play();
    },
    stop: function() {
      sound.pause();
      sound.currentTime = 0;
    }
  };
}
此函数获取要加载的声音的名称,然后返回另外两个用于启动和停止声音的函数。这两个函数始终引用相同的
音频
实例

var aNatural = createSound('A natural.mp3');

document.onkeydown = function() {
  // ...
  aNatural.start();
  // ...
}

document.onkeyup = function() {
  // ...
  aNatural.stop();
  // ...
}

如果要组织所有声音,则需要根据相应的键码存储声音

var notes = [
  { key: 81, sound: createSound('A natural.mp3') },
  { key: 82, sound: createSound('B natural.mp3') },
  { key: 83, sound: createSound('C natural.mp3') }
  // ...
];
然后,您可以创建事件侦听器,用适当的键代码触发每个声音

document.onkeydown = function() {
  var pressedKey = e.which;

  notes.forEach(function(note) {
    if(note.key === pressedKey) {
      note.sound.start();
    }
  });
}

// do the same for keyup
// ...

要解决您的代码,只需将声音声明移到函数之外。。。但是Dan对于同时玩多个实例是正确的

var A = new Audio("A natural.mp3"); 

function startAnatural(){
    A.play();
}

function stopAnatural(){
  A.pause();
  A.currentTime = 0;
}

document.onkeydown = function(e){
    e = e || window.event;
    var key = e.which || e.keyCode;
    if(key===81){
        startAnatural();
    }
};

document.onkeyup = function(e){
    e = e || window.event;
    var key = e.which || e.keyCode;
    if(key===81){
        stopAnatural();
    }

};

顺便说一句,我必须对13个不同的声音文件做同样的事情,什么是最好的组织方式?@amarilewis更新了答案。所有这些东西的顺序是否重要?对不起,我已经有一段时间没有编码了,尽管这不是必需的,但在使用之前定义函数是一种很好的做法。所以函数,然后创建注释,然后设置事件侦听器。