Javascript 多个音频播放器，但仅第一次工作

问题是，当我在html页面上有两个或更多播放器时，我只能在第一个播放器中播放音乐，而其余的都不能播放

我的定制HTML5音频播放器：

<audio id="music" preload="true">
    <source src="music/interlude.mp3">
</audio>
<div id="wrapper">
    <div id="audioplayer">
        <button id="pButton" class="play"></button>
        <div id="timeline">
            <div id="playhead"></div>
        </div>
    </div>
</div>

---

我注意到您使用了大量的ID。当“第一件事”在页面上起作用时，通常是ID引起了问题

将
玩家的所有ID更改为
类属性。您还需要更新JavaScript，如下所示：

var music = document.getElementById('music');
music.addEventListener(...

var music = document.querySelectorAll(".music"); // class="music"
for (var i = 0; i < music.length; i++) {
  music[i].addEventListener(...

更像这样：

var music = document.getElementById('music');
music.addEventListener(...

var music = document.querySelectorAll(".music"); // class="music"
for (var i = 0; i < music.length; i++) {
  music[i].addEventListener(...

var music=document.querySelectorAll（“.music”）；//class=“音乐”
for（var i=0；i

您应该会发现这对您很有用。
第二个播放器在哪里？只要您愿意。我刚刚发布了完整的音频播放器块，可以一个接一个地复制。问题是，若您使用完全相同的代码，它只会转到第一个id为
音乐的播放器。
。您每页只能有一个id。有3个
\music
混淆了糟糕的JavaScript。有没有可能粘贴完整的返工代码？我对js知之甚少，我不是这段代码的作者。