web-dev-qa-db-ja.com

HTML5オーディオタグを使用してサウンドを複数回再生できないのはなぜですか？

これがサウンドの「保存」方法です。

<audio id = "hammer" src="res/sounds/Building/hammer.wav"></audio>

実際のゲーム（私はサウンドを使用しています）では、これを使用してサウンドを再生します。

   function playSound(soundid)
   {
        document.getElementById(soundid).currentTime = 0;
        document.getElementById(soundid).play();
   }

しかし、音は初めて再生され、二度と再生されません！コンソールの「currentTime」を0にリセットしようとしましたが、文字通り次のようになります。

>document.getElementById("hammer").currentTime = 0
0
>document.getElementById("hammer").currentTime
0.340...

なぜこれが起こっているのですか、どうすれば修正できますか？

javascripthtmlaudiohtml5-audio
25
corazza

このスライド および html5ゲーム開発に関するEvanWallaceとJustinArdiniのプレゼンテーション の前の3つのスライドを参照してください。

いくつかの素晴らしいゲームを作るためのすべてのリソースについては、彼らの話の一部： http://madebyevan.com/gamedevclass/

現在のところ、オーディオはまだすべてのブラウザで一貫して機能しているわけではありません。

  • 要素はChromeにリロードする必要があります。そうしないと、1回しか再生されません
  • Firefoxで要素をリロードしないでください。リロードしないと、遅延が発生します
function playSoundEvent() {
  if (window.chrome) elems[index].load()
  elems[index].play()
  index = (index + 1) % elems.length
}
24
DTrejo

最近、html5でこの問題が発生しました。サファリを除いてどこでも働いた。 play（）を呼び出す前にload（）を使用すると、この問題が解決しました。また、イベントハンドラーがサウンドをトリガーするときに、効果音がヘビークリッカーと重ならないようにするのにも役立ちます。

Here what I used
<audio id="sound-one" preload="auto">
    <source src="http://myurl/foo.mp3"></source>
    <source src="http://myurl/foo.ogg"></source>
</audio>


<a href="#" id="navigation-id">click here</a>  



Jquery
$("#navigation-id") //this attached is to an element on the page
.mouseover(function() {
    sound-one.load();                               
    sound-one.play();
    });
5
Jay

将来この投稿に出くわした人にとって、オーディオタグはゲームオーディオを行うための優れた方法ではありません。

代わりに、時間をかけて WebAudio API を学ぶことを強くお勧めします。

1
Chris Jaynes

HTML5でピアノを開発しているときに同じ問題に直面する数か月前。キーが何度も押されたとき、私は停止し、巻き戻して、キーを押すたびにオーディオを再生しなければなりませんでした。この質問で書かれた同じコードを使用しましたが、FirefoxとSafariで機能しましたが、Chromeでは機能しませんでした。 Chrome再び再生されませんでした。最後に、コードを変更して機能させる必要がありました。イベントonseekedのリスナーを1つ追加し、currentTime = 0を設定しました。そして、イベントハンドラーでplayが呼び出されました。これは私にとってはうまくいきました。同様に、あるアクションのイベントを待ってから、多くの場所で次のアクションを実行する必要がありました。これはChromeの古いバージョンでした。後で、一部のバージョンのブラウザでもオーディオをサポートしていますが、それぞれのサポート方法は少し異なります。この違いは、オーディオタグを付けてオーディオを再生するだけではわかりませんが、Javascriptを使用してオーディオを制御しようとすると発生します。それはすべて古いバージョンのブラウザに関するものであり、すべての最新バージョンではるかに優れています。したがって、最新バージョンのChrome（私のピアノでもChrome = 10コード変更なし）そしてオーディオフォーマットに関しては、単一のwavファイルではなく、オーディオのmp3ファイルとoggファイルを保持することをお勧めします。

0
Diode