如何在JavaScript中的按键上播放声音？

Question

我正在尝试编写我的JavaScript代码，以便仅在按下某个键时才播放声音。我尝试将其关联的HTML代码是：

<div data-key="65" class="key">
  <kbd>A</kbd>
  <span class="sound">clap</span>
</div>

稍后在HTML文档中将数据密钥与音频文件关联。我需要在JavaScript中进行设置，以便在按下“ A”时可以播放声音。到目前为止，我已经尝试过：

document.querySelector('65').addEventListener('onkeydown', function() {
playAudio ();
});

关于如何进行这项工作的任何想法？

Answer 1

你应该这样做。

首先，创建一个音频对象并将其隐藏：

<audio id="audio" controls style="display:none">
  <source src="http://butlerccwebdev.net/support/html5-video/media/soundfile.mp3" type="audio/mpeg"> Your browser does not support the audio element.
</audio>

然后进行EventListener按键确认，确保它是正确的按键：

document.addEventListener('keydown', function(e) {
  if (e.keyCode == 65) {
    document.getElementById('audio').play();
  }
});

https://jsfiddle.net/cwvfmLvk/6/