html - 我在一个页面上有多个 HTML 5 <Audio> 标签，我希望所有标签在播放另一个标签时都暂停

Question

我想我需要一个脚本来“获取”所有正在播放的 HTML5 音频控件并“暂停”它们，除了用户点击播放的那个。我已经看过并且可以只使用一个音频控件来处理简单的播放、暂停、停止，但是我的技能远远达不到编写我想要的多个音频控件的能力。音频控件是一个简洁的解决方案，并且与我当前的设计很好地集成在一起，我只需要帮助使其正常工作。用例:

https://aberaeronskies.com/页面加载并且没有播放任何所需的内容，用户单击音频控件标签上的播放并播放所需的轨道片段。用户点击另一个(有14个)开始播放，麻烦的是，第一个还在播放，这是不想要的；一个人可以点击所有这些，他们都会玩!

要求是脚本或电话或其他任何东西(我不是编码员，只是作为伴侣的免费赠品)，当用户在 14 个轨道中的任何一个上单击播放时，它会暂停所有其他播放轨道。

我以为是这样:Pause all other players besides activated one. jQuery audio plugin for <audio> element和 Play selected audio while pausing/resetting others但我不能让他们工作。

这可能是无法做到的，我需要重新考虑多个轨道的整个呈现方式，如果是这样，关于在哪里看的进一步建议(除了上述内容)也会很有用。

非常感谢...

Answer 1

啊...
这有效

var curPlaying;
window.addEventListener("play", function(evt)
{
if(window.$_currentlyPlaying && window.$_currentlyPlaying != evt.target)
{
    window.$_currentlyPlaying.pause();
} 
window.$_currentlyPlaying = evt.target;
}, true);
$(function () {
$(".playback").click(function (e) {
    e.preventDefault();
    var song = $(this).next('audio')[0];
    if (song.paused) {
        if (curPlaying) {
            $("audio", "#" + curPlaying)[0].pause();
        }
        song.play();
        curPlaying = $(this).parent()[0].id;
    } else {
        song.pause();
        curPlaying = null;
    }
});
});