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

Answer 2

一些小的修改后，您可以使用指定的鍵作為音頻剪輯的觸發器

  if (e.keyCode == 65) {
    if(document.getElementById('audio').paused){
    document.getElementById('audio').play();
   }
   else{
    document.getElementById('audio').pause;
  }
});

在這里它將作為音頻文件的觸發器。信用：Andreas Moldskred

Answer 3

這可能對你有用。

var play=document.getElementById('play');
var music=document.getElementById('music1')
document.addEventListener('keydown',function(e){
    if(e.keyCode==65){
        if(music1.paused){
            music1.play();
        }
        else{
            music1.pause();
        }
    }
})