4

让我首先说每当播放器与墙壁发生碰撞时，我都会尝试播放 mp3 文件，这很简单并且完成了。但是我希望当播放器撞到另一面墙时播放另一个声音文件。我尝试<audio>在 html 文件中使用这两个标签，而不是在 Javascript 中播放它：

var sound = document.getElementById("TheHtml5Tag");

还是同样的问题，只能播放一个声音，直到第一个声音完成后才会播放下一个声音。即使使用多个<audio>标签和多个声音。 接下来我也尝试过使用类似的代码：

sound = new Audio('Wall_Hit_01.mp3'); 
sound.addEventListener('ended', function() {
    this.currentTime = 0;
}, false);

比玩它：sound.play(); 但仍然是同样的问题：我无法播放sound2.play();或sound3.play();在第一个声音完成之前。非常感谢任何答案/建议。如果没有办法在每个浏览器上执行此操作，那么一些关于如何停止所有声音以播放新声音的提示可能会很好。虽然我更愿意回答原来的问题。

4

2 回答 2

2

Howler.js提供了一个很好的库来触发游戏的跨浏览器声音精灵，应该可以解决问题！

于 2013-08-08T06:38:10.803 回答
2

我发现了一个使用纯 JavaScript 的非常简洁的解决方案。

在我的 HTML 文件中，我将两个音频元素和一个播放音频按钮放在同一个 div 中。

<div id="audioplay">
<audio id='audio1' src="ex1.wav" type="audio/wav" preload="auto" autobuffer controls ></audio>
<audio id='audio2' src="ex2.wav" type="audio/wav" preload="auto" autobuffer controls></audio>
<button id='playaudio' onclick='playAudio()'>Play Audio</button>

在我的 JS 文件中（你也可以使用脚本标签），我放了这段代码，它可以播放这两个文件。确保您的音频 src 标签指向正确的位置！

function playAudio(){
    var audio1 = document.getElementById('audio1');
    var audio2 = document.getElementById('audio2');
    audio1.play();
    audio2.play();
}
于 2017-09-27T00:22:43.943 回答