audio标签实现单一音频流

Question

部分代码如下：

    <p>
        <audio controls="controls">
         <source src= "a" type="audio/mp4"/>
            Your browser does not support this audio format.
        </audio>
    </p>
    <p>
        <audio controls="controls">
          <source src="b" type="audio/mpeg" />
        Your browser does not support this audio format.
        </audio>
    </p>

想要实现歌曲a正在播放的时候，点击b的播放按钮，a会自动暂停，怎么写代码呀？

Answer 1

var audios = document.querySelectorAll("audio");
var btns = document.querySelectorAll(".btn-play"); // 假设你有这么一系列的按钮

[].forEach.call(btns, function(btn) {
    btn.onclick = function(){
        [].forEach.call(audios, function(audio){ audio.pause() });
        this.parentNode.querySelector("audio").play();
    }
})