javascript - 如何在 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/