HTML5/JSを用いてMP3ファイルを再生しております。
Audio①を再生完了⇒Audio②を再生を実装しております。
windowsですと、Audio①→Audio②の再生がうまくいくのですが、
Android/iOSだとAudio①しか再生されません。恐らく再生完了が返ってこないと思われます。
また、HTML側ではプルダウンメニューにて再生する音を選択できるように設定しております。
ご教授お願いします。
■フォルダ構成
/audio/aa/audioA1.mp3
------------audioA2.mp3
-------bb/audioB1.mp3
------------audioB2.mp3
■HTML
HTML
1<p>A: 2<select name="A"> 3 <option value="audioA1">A1</option> 4 <option value="audioA2">A2</option> 5 <option value="audioA3">A3</option> 6</select> 7</p> 8 9<!-- ○B --> 10<p>B: 11<select name="B"> 12 <option value="audioB1">B1</option> 13 <option value="audioB2">B2</option> 14 <option value="audioB3">B3</option> 15</select> 16</p> 17 18<!-- ○再生ボタン --> 19<p> 20<form name="playButton"> 21 <input type="button" name="playButton" value="再生" onClick="playAudio()"> 22</form> 23</p>
■JavaScript
JavaScript
1//再生スタート 2function playAudio(){ 3 //Aの値を取得 4 var selectedA = $("#A").val(); 5 //Bの値を取得 6 var selectedB = $("#B").val(); 7 8 //Aのパスを指定 9 audioA.src = "audio/aa/" + selectedA + ".mp3"; 10 //Bのパスを指定 11 audioB.src = "audio/bb/" + selectedB + ".mp3"; 12 13 //Aを再生 14 audioA.play(); 15 16 //★Aの再生が完了したら 17 audioA.addEventListener("ended", function(e) { 18 //Bを再生 19 audioB.play(); 20 }); 21}
あなたの回答
tips
プレビュー