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 回再生されるはずです。サーバーへのリクエストは、ページの読み込み時に 1 つだけである必要があります。play() を複数回呼び出しても、複数のリクエストをトリガーするべきではありません。

実際の動作:
- Firefox (19.0.2)、Chrome (26.0.1410.43)、および Opera (12.15) は期待どおりに動作します。
- Safari (6.0.3) は目的のサウンドを 1 回だけ再生し、要求されたときにそのサウンドまたはその他のサウンドの再生を拒否します。

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 に答える