播放多首曲目时如何防止音频重叠？

Question

我有 3 个链接块，如果用户单击其中两个，我希望将其中一首歌曲静音。

不幸的是，我对 jQuery/Javascript 有点新手，但这是我现在拥有的正确代码，但它不起作用：

<script type="text/javascript">
var isPlaying=false
$(document).ready(function(){
    $('.play').click(function(){
        var audioID = "sound" + $(this).attr('id');
        var $this = $(this);
        var music = new Audio(audio);
        if (!isPlaying) {
            // Not playing, let's play
            isPlaying = true;
            music.play();
        } else {
            // Stop the music
            isPlaying = true;
            music.pause();
        };
    });
});
</script>
<audio loop id="sound1" src="3.mp3"> </audio>
<audio loop id="sound2" src="2.mp3"> </audio>
<audio loop id="sound3" src="3.mp3"> </audio>

我确实有另一个代码可以播放分配给其链接块的三首歌曲，但它们重叠。

$('.play').click(function(){
    var $this = $(this);
    // starting audio
    var audioID = "sound" + $(this).attr('id');
    $this.toggleClass('active');
    if($this.hasClass('active')){  
        $("#" + audioID).trigger('play');
    } else {
        $("#" + audioID).trigger('pause');
    }

非常感谢任何帮助或正确方向的指示！