同时播放多个声音

Question

使用 HTML 5，我想同时播放多个声音。我该如何做？

这是我目前的代码：

<audio controls="controls">
    <source src="audio/(TESBIHAT).mp3" type="audio/mpeg" />
    <source src="audio/Dombra.mp3" type="audio/mpeg" />

    <embed height="50px" width="100px" src="audio/(TESBIHAT).mp3" />
    <embed height="50px" width="100px" src="audio/Dombra.mp3" />
</audio>

- Polymorphism

---

可能是https://dev59.com/RHI-5IYBdhLWcg3wR2Nr中的重复问题。 - Waleed Khan

Answer 1

使用JavaScript和HTML5音频API，你可以像这样做：

var snd1  = new Audio();
var src1  = document.createElement("source");
src1.type = "audio/mpeg";
src1.src  = "audio/Dombra.mp3";
snd1.appendChild(src1);

var snd2  = new Audio();
var src2  = document.createElement("source");
src2.type = "audio/mpeg";
src2.src  = "audio/(TESBIHAT).mp3";
snd2.appendChild(src2);

snd1.play(); snd2.play(); // Now both will play at the same time

我在Chrome v.20中进行了测试，似乎可以正常工作 :)

<source> 标签用于指定相同文件的不同格式，这样浏览器可以在第一个格式不受支持时选择另一种格式作为后备。这就是你自己提出的解决方案不起作用的原因。

- Lasse Christiansen

---

它不能在Opera中工作，因为Opera不支持MP3格式。请使用.ogg格式代替。详见http://html5doctor.com/html5-audio-the-state-of-play/。 - trainoasis

这个能在只支持一路音频流的移动设备上运行吗？ - Kokodoko

你能不创建元素来完成吗？ - Pixsa

我尝试了一下，但是它不起作用。显示 Uncaught (in promise) DOMException。 - Arvind K.

在移动设备上表现不佳。 - MAZ