javascript - html5/javascript 音频同时播放多首轨道

Question

是否可以同时播放整个音频实例？

我知道，我可以每次创建一个新实例并在每个实例上调用 .play()，但我认为它很脏。

sound1 = new Audio('sound1.mp3');  
sound2 = new Audio('sound2.mp3');  
sound1.play();  
sound2.play();  

它或多或少与此线程中的相同:Play multiple sound at the same time

但必须有更优雅的方式吗？

Answer 1

编辑:MediaController 和 mediagroup 原来是汽件。你会想要坚持使用“肮脏”的方式来做到这一点，至少现在是这样，因为没有官方的同步解决方案。

同步播放多个音频或视频对象的正确方法是使用mediagroup 属性和相应的MediaController 对象。见文章"HTML5 multi-track audio or video" :

[A]n attribute called @mediagroup can be added in markup to slave multiple media elements together. This is administrated in the JavaScript API through a MediaController object, which provides events and attributes for the combined multi-track object.

将两个音频文件设置为一个mediagroup。当媒体元素分配给 mediagroup 时，将为该组创建一个 MediaController。在该 Controller 上使用 play() 方法，组中的所有媒体元素将同步播放。

以编程方式，您可以像这样分配一个 mediagroup，然后从那时起，从任何一个 MediaController 触发 play()从媒体元素，像这样:

sound1 = new Audio('sound1.mp3');
sound2 = new Audio('sound2.mp3');
sound1.mediaGroup = 'soundGroup';
sound2.mediaGroup = 'soundGroup';
sound1.controller.play();

(来源:w3school.com 的 HTML 音频/视频 DOM mediaGroup Property page、controller Property page、play() Method page 和 the standard)

注意:我没有测试上面的代码；请，如果您可以确认此代码不符合标准并且无法按预期运行，请告诉我们。请注意，您正在研究 HTML5 标准的一个非常新的方面，在这种情况下，不要指望广泛的浏览器兼容性。 (截至 2014 年 1 月)