在iPad上播放声音时延迟

Question

在我的小型HTML5 web应用程序中，我想播放声音来响应用户的操作。当用户点击按钮时，在onclick处理程序中，我会播放这样的声音：

    url = "assets/sounds/buzz" + (this.canPlayMP3 ? ".mp3" : ".ogg");
    sound = new Audio(url);
    sound.load();
    sound.play();

这在Firefox上非常有效。不幸的是，在iPad（运行iOS 5.1.1的iPad2）上，我在播放声音之前有2秒的延迟。每次我播放声音样本时都会发生这种情况，而不仅仅是第一次。

MP3文件长9KB。iPad使用与运行Firefox的电脑完全相同的Wifi连接连接到网络。

我怎样才能弄清楚发生了什么？

Answer 1

您可能需要为每个声音创建一个音频元素的实例：

var Sounds = {
    cat: new Audio('/sounds/meow.ogg'),
    bird: new Audio('/sounds/tweet.ogg')
};

然后你可以反复播放相同的元素：

function playSound(name) {
    Sounds[name].currentTime = 0;
    Sounds[name].play();
}
playSound('cat');

如果iOS破坏了你的Audio对象，你可以在缓存清单中缓存声音文件：

CACHE MANIFEST
# 2012-08-09:v1.3
NETWORK:
*
CACHE:
/sounds/meow.ogg
/sounds/tweet.ogg

Answer 2

将加载移到处理程序之外怎么样，例如使其全局/预加载？然后内部处理程序只调用播放方法。