3

.play()音を1つずつ再生する関数ごとに関数呼び出しフォールバックを行い、連続した音列を再生したい。

一番おもしろいのは 、iPad デバイスで再生するたびに異なるサウンド パフォーマンスが得られることです。 *音声を 3 回再生する場合もあれば、4 回再生する場合もあれば、1 回だけ再生する場合もあります。*

iPadのみの「急停止問題」ですが、私のGoogle Chromeでは問題ありません。

これは iPad の自動再生の問題ではありません。1 回目で既にトリガーしていると思います...

見て、おそらくiPadでテストしてください。助けてください...

Html - 本文:

<audio id="html5soundtag"> 
    <source src="1.mp3" type="audio/mpeg">
</audio> 
<a href="javascript://" onClick="playhtml5sound1('1.mp3')">aaaa</a>

Javascript:

var audioPath ="";

var audioElement = document.getElementById('html5soundtag');

function playhtml5sound1(filename){ 
    audioPath = filename;
    audioElement.src = audioPath;
    audioElement.src = audioPath
    audioElement.load()
    audioElement.play();
    audioElement.addEventListener("ended",soundcallback1);
};
var soundcallback1 = function (){
    alert("1st");
    audioElement.removeEventListener("ended",soundcallback1);
    playhtml5sound2("1.mp3");
}


function playhtml5sound2(filename){
    audioPath = filename;
    audioElement.src = audioPath;
    audioElement.src = audioPath
    audioElement.load();        
    audioElement.play();
    audioElement.addEventListener("ended",soundcallback2);

};
var soundcallback2 = function (){
    alert("2nd");
    audioElement.removeEventListener("ended",soundcallback2);
    playhtml5sound3("1.mp3");
}

function playhtml5sound3(filename){
    audioPath = filename;
    audioElement.src = audioPath;
    audioElement.src = audioPath
    audioElement.load();
    audioElement.play();
    audioElement.addEventListener("ended",soundcallback3);

};var soundcallback3 = function (){
    alert("3rd");
    audioElement.removeEventListener("ended",soundcallback3);
    playhtml5sound4("1.mp3");
}

function playhtml5sound4(filename){
    audioPath = filename;
    audioElement.src = audioPath;
    audioElement.src = audioPath
    audioElement.load();
    audioElement.play();

    audioElement.addEventListener("ended",soundcallback4);

};var soundcallback4 = function (){
    alert("4th");
    audioElement.removeEventListener("ended",soundcallback4);
    playhtml5sound5("1.mp3");
}

function playhtml5sound5(filename){
    audioPath = filename;
    audioElement.src = audioPath;
    audioElement.src = audioPath
    audioElement.load();
    audioElement.play();

    audioElement.addEventListener("ended",soundcallback5);

};var soundcallback5 = function (){
    alert("5th");
    audioElement.removeEventListener("ended",soundcallback5);
    playhtml5sound6("1.mp3");
}

function playhtml5sound6(filename){
    alert("This is End. " + filename);
}
4

2 に答える 2

1

これで問題が解決するはずです。少なくとも、コードの保守性が向上します。

var audioPath = "";
var audioElement = document.getElementById('html5soundtag');

var soundIndex = 0;
var sounds = ["1.mp3","2.mp3","3.mp3","4.mp3","5.mp3"]

function playhtml5sound(){
    if(soundIndex < sounds.length){
        audioPath = sounds[soundIndex];
        audioElement.src = audioPath;
        audioElement.load()
        audioElement.play();
        soundIndex++;
    }else{
        audioElement.removeEventListener("ended",playhtml5sound);
        alert("Last sound ended!")
    }
};

audioElement.addEventListener("ended", playhtml5sound);

<a href="javascript://" onClick="playhtml5sound()">aaaa</a>

音楽が終了するたびに、playhtml5sound()実行され、次のサウンドが再生されます。
最後のサウンドが再生された場合は、イベントリスナーを削除し、終了を警告します。

于 2012-12-13T07:56:48.923 に答える
0

直接の答えではありませんが、コードが大きすぎてコメントに表示できません。

スクリプトに次のコードを追加し、コンソールログで終了以外のイベント（ストールやエラーイベントなど）がないかどうかを確認することをお勧めします。私はiPadとiPodでテストしましたが、どちらも問題なく動作します。ネットワークが原因でエラーが発生している可能性があります。

var media_events = new Array();
function audioattachevents(selector) {
    media_events["abort"] = 0;
    media_events["error"] = 0;
    media_events["mousewheel"] = 0;
    media_events["blur"] = 0;
    media_events["focus"] = 0;
    media_events["pause"] = 0;
    media_events["canplay"] = 0;
    media_events["formchange"] = 0;
    media_events["play"] = 0;
    media_events["canplaythrough"] = 0;
    media_events["forminput"] = 0;
    media_events["playing"] = 0;
    media_events["change"] = 0;
    media_events["input"] = 0;
    media_events["progress"] = 0;
    media_events["click"] = 0;
    media_events["invalid"] = 0;
    media_events["ratechange"] = 0;
    media_events["contextmenu"] = 0;
    media_events["keydown"] = 0;
    media_events["readystatechange"] = 0;
    media_events["dblclick"] = 0;
    media_events["keypress"] = 0;
    media_events["scroll"] = 0;
    media_events["drag"] = 0;
    media_events["keyup"] = 0;
    media_events["seeked"] = 0;
    media_events["dragend"] = 0;
    media_events["load*"] = 0;
    media_events["seeking"] = 0;
    media_events["dragenter"] = 0;
    media_events["loadeddata"] = 0;
    media_events["select"] = 0;
    media_events["dragleave"] = 0;
    media_events["loadedmetadata"] = 0;
    media_events["show"] = 0;
    media_events["dragover"] = 0;
    media_events["loadstart"] = 0;
    media_events["stalled"] = 0;
    media_events["dragstart"] = 0;
    media_events["mousedown"] = 0;
    media_events["submit"] = 0;
    media_events["drop"] = 0;
    media_events["mousemove"] = 0;
    media_events["suspend"] = 0;
    media_events["durationchange"] = 0;
    media_events["mouseout"] = 0;
    media_events["timeupdate"] = 0;
    media_events["emptied"] = 0;
    media_events["mouseover"] = 0;
    media_events["volumechange"] = 0;
    media_events["ended"] = 0;
    media_events["mouseup"] = 0;
    media_events["waiting"] = 0;

    for (key in media_events) {
      selector.bind(key, function (e, data) {
        console.log(e.type);
      });
    }
}

audioattachevents($('#html5soundtag'));

特に短い表記が必要な場合：

media_events = {"abort":0,"error":0, "mousewheel":0, "blur":0, "focus":0, "pause":0, 
   "canplay":0, "formchange":0, "play":0, "canplaythrough":0, "forminput":0, 
   "playing":0, "change":0, "input":0, "progress":0, "click":0, "invalid":0, 
   "ratechange":0, "contextmenu":0, "keydown":0, "readystatechange":0,       
   "dblclick":0, "keypress":0, "scroll":0, "drag":0, "keyup":0, "seeked":0, 
   "dragend":0, "load*":0, "seeking":0, "dragenter":0, "loadeddata":0, 
   "select":0, "dragleave":0, "loadedmetadata":0, "show":0, "dragover":0, 
   "loadstart":0, "stalled":0, "dragstart":0, "mousedown":0, "submit":0, 
   "drop":0, "mousemove":0, "suspend":0, "durationchange":0, 
   "mouseout":0, "timeupdate":0, "emptied":0, "mouseover":0, 
   "volumechange":0, "ended":0, "mouseup":0, "waiting":0}
于 2012-12-13T07:58:07.383 に答える