AudioJS:每页每次只播放html5音频

Question

我目前使用的是简单的AudioJs脚本，它非常容易集成，但如果我有多个音频文件在同一个页面上，我希望用户能够点击播放任何和收听，而不需要先停止前一个文件…基本上，我需要一个开关，说“停止所有”，然后播放这个

有关于如何实现这一点的帮助吗？

我试过了

    $.each($('audio'), function() {
        this.pause();
    });

但这并不能反转AudioJs创建的每个实例的按钮和状态

Answer 1

这类功能的一般技巧是在所有播放器上绑定onplay事件；当你播放一个播放器时，它会触发现在你暂停所有播放器，除了onplay被触发的那个，但这里的问题是audiojs不提供音频事件(它只提供播放，暂停等方法)在它的包装器objects.But中，你可以做一些事情:每个播放器对象将有一个对它相应的HTML5 <audio>元素的引用(实际上是播放mp3)你可以使用这个和使用element属性直接绑定到那个上。

1.在所有播放器上绑定onplay

allAud = a.createAll();
for(var i=0; i<allAud.length;i++)
{ 
    allAud[i].element.onplay = function pauseOthers();
}

2.当onplay触发器循环遍历所有播放器的<audio>时，暂停除触发事件的那一个以外的所有播放器(使用audiojs包装器pause()方法

function pauseOthers() { 
    for(var j=0; j<allAud.length;j++)
    {
        if(allAud[j].element != this)  //pause all except the one being played
        allAud[j].pause(); // can also use `this.pause()` , but better let audiojs do that incase it's handling some play/pause animation
    }
}

演示：http://jsfiddle.net/rqsxxjmd/