html - 在 Chrome 中播放多种声音

Question

我正在为 Facebook 开发 HTML5 游戏。我有以下 HTML 代码:

<audio style="visibility: hidden;" controls="controls" id="sound-0">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>
<audio style="visibility: hidden;" controls="controls" id="sound-1">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>
<audio style="visibility: hidden;" controls="controls" id="sound-2">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>
<audio style="visibility: hidden;" controls="controls" id="sound-3">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>
<audio style="visibility: hidden;" controls="controls" id="sound-4">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>
<audio style="visibility: hidden;" controls="controls" id="sound-5">
    <source src="sound/sound_new.ogg" type="audio/ogg"/>
    <source src="sound/sound_new.mp3" type="audio/mp3"/>
</audio>

以及以下启动声音的 Javascript:

if (this.hitFlag > 6) this.hitFlag = 1;
var soundElem = document.getElementById('sound-' + (this.soundFlag % 6) + '0' );
soundElem.play();

每次点击鼠标都会触发一个声音事件。问题出在 Chrome 上，点击几十次后声音消失或开始播放时有相当长的延迟(十几秒)。但是在FF或者Opera中播放是没有问题的。

Answer 1

这绝对是一个错误，但我认为它与实际元素有关，而不是声音播放部分。您可以通过预加载音频轻松解决这个问题，为每次播放声音实例化一个新的音频对象，然后最后在每个节拍检查声音对象以确定它们是否已完成播放，以便您清理内存。

当然，预加载是这样的:

var _mySnd = new Audio('my/snd/file/is/here.mp3');

实例化是这样的:

var _sndCollection = [];
var n = _sndCollection.length;

_sndCollection[n] = new Audio();
_sndCollection[n].src = _mySnd.src;
_sndCollection[n].play();

清理检查将是:

for (var i = 0; i < _sndCollection.length; i++)
{
    if (_sndCollection[i].currentTime >= _sndCollection[i].duration)
    {
        _sndCollection.splice(i, 1);
        i--;
    }
}

我在我自己的 HTML5 游戏引擎中使用了类似的东西，到目前为止它运行良好。