Javascript 播放新音频时停止播放音频

如果按下按钮，则应播放新声音并停止当前播放的声音。当播放声音时，它也应该使“暂停”类处于打开状态。但是，如果与按钮相关的声音没有播放，则该类是正常的，即“播放”

//这是可以按下播放声音的按钮
玩
玩
玩
//尝试使var音频根据按下的按钮选择声音
var audio=document.createElement（'sound'）；
//按下按钮时播放声音
$（“.play”）。在（'click'，function（）上{
如果（音频暂停）{
音频播放（）；
}   
否则{
audio.pause（）；
}
$（this）.toggleClass（“pause”）；//切换到一些新的css以获得暂停按钮
});
//如果音频已经播放并且按下了另一个声音，则播放的音频将停止，新按下的声音将播放。
如果正在播放任何其他音频{
然后那个音频。停止，这个。音频。那个被点击了。播放
}
//使已经播放的按钮的CSS切换回来，新按钮的CSS切换到pause类。
美元（即）；
$（this.toggleClass（“暂停”）；

我只想在跨距中嵌入音频元素，如下所示：

<span class="play"><audio src="sound1.mp3">Play</audio></span>
<span class="play"><audio src="sound2.mp3">Play</audio></span>
<span class="play"><audio src="sound3.mp3">Play</audio></span>

---

嘿，杰克，我很感激你的回答，但这并不是我想要做的。我没有嵌入式音频元素去。并且一次只能播放一个声音。那么上面的实现会引起什么问题呢？使用内嵌音频元素只是使用HTML5音频的一种简单方法。

<span class="play"><audio src="sound1.mp3">Play</audio></span>
<span class="play"><audio src="sound2.mp3">Play</audio></span>
<span class="play"><audio src="sound3.mp3">Play</audio></span>

$(".play").click(function () {
   $(".play").removeClass('pause').addClass('play').pause();
   $(this).addClass('pause').removeClass('play').play();
});