javascript - 根据播放的声音显示文本

Question

所以，我希望能够显示文本，告诉我按下按钮时正在播放什么声音，但我什至不知道从哪里开始。

我的 HTML 是您按下的按钮

我的 JavaScript 将播放的声音随机化

任何帮助将不胜感激

<a href="#" id="soundbutton" class="button button1"></a>
  <script type="text/javascript" src="meme.js"></script>

---

var sounds = ["Titanic.mp3",
"Legitness.mp3",
"Lying.mp3",
"Lebron.mp3",
"Yeahboy.mp3",
"Rocketlauncher.mp3",
"Billnye.mp3",
"Running.mp3",
"Donethis.mp3"
];
var sound;
function generateRandomNumber(max) {
  return Math.floor(Math.random() * max);
}
function playSound() {
  var x = generateRandomNumber(sounds.length - 1);
  var soundSrc = sounds[x];
  if (sound) {
      sound.pause();
  } else {
      sound = new Audio();
  }
  sound.src = soundSrc;
  sound.play();
}
document.getElementById('soundbutton').addEventListener('click', playSound);

Answer 1

soundSrc 会告诉您正在播放什么声音。在我的 playSound() 函数示例中，我只是将一些显示状态的元素的 .innerHTML 设置为 soundSrc。

var sounds = [
    "Titanic.mp3",
    "Legitness.mp3",
    "Lying.mp3",
    "Lebron.mp3",
    "Yeahboy.mp3",
    "Rocketlauncher.mp3",
    "Billnye.mp3",
    "Running.mp3",
    "Donethis.mp3"
];

var sound;

function generateRandomNumber(max) {
    return Math.floor(Math.random() * max);
}

function playSound() {
    var x = generateRandomNumber(sounds.length - 1);
  
    var soundSrc = sounds[x];
  
    if (sound) {
        sound.pause();
    } else {
        sound = new Audio();
    }

    sound.src = soundSrc;
    sound.play();
  
    document.getElementById("song").innerHTML = "Now playing: " + soundSrc;
}

document.getElementById('soundbutton').addEventListener('click', playSound);

<a href="#" id="soundbutton" class="button button1">Play new song!</a>
<h1 id="song">Not playing anything yet!</h1>