2

这是我的代码：

html:

<div id="audio-files" style="display: none;">
    <audio id="click-sound">
        <source src="/assets/click.mp3" type="audio/mpeg">
        <source src="/assets/click.wav" type="audio/wav">
    </audio>
</div>

JavaScript：

play: function() {
  var audio = $('#audio-files').find('audio#click-sound');
  if (audio.length) {
    audio[0].play();
  }
}

期望的行为：
当我调用 play() 时，声音应该播放一次。对服务器的请求应该只有 1 个 - 在页面加载时。多次调用 play() 不应触发多个请求。

实际行为：
- Firefox (19.0.2)、Chrome(26.0.1410.43) 和 Opera(12.15) 按预期工作。
- Safari (6.0.3) 只播放一次所需的声音，然后在被要求时拒绝播放它或任何其他声音。

audio[0].load()我之前尝试过添加，audio[0].play()但这会导致浏览器每次被要求播放音频时都会发出请求，这是完全不可取的。

小提琴：http: //jsfiddle.net/Tpvfm/

4

1 回答 1

1

我认为您的示例 mp3 文件有问题。我刚刚从您的小提琴中删除了它（mp3），它可以在我的 OSX 上的 Safari 中使用。

<div id="audio-files" style="display: none;">
  <audio id="click-sound">
    <source src="/assets/click.wav" type="audio/wav">
  </audio>
</div>

小提琴：73GCX

于 2013-04-12T14:44:11.397 回答