连续HTML5音频.play（），只有第1次触发

Question

我想在每一个功能的做函数调用回退与.play()由1

最有趣的播放声音1播放连续的声音序列是： 每次在iPad设备上播放时都会有不同的声音表现。 * 有时播放音频3次，有时4次，甚至只有1次！ *

只有iPad中的“突然停止问题”，在我的谷歌浏览器上没问题。

它不是iPad上的自动播放的问题，我想怎么我已经在第一时间触发...

请看看，并有一个测试的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); 
} 

Answer 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()，播放下一个声音。
如果播放了最后一个声音，请移除事件侦听器并提醒结束。

Answer 2

不是直接回答，但代码太大，无法在评论中显示。

我建议您将以下代码添加到您的脚本中，并检查控制台日志中是否有结束的事件（例如停滞或错误事件）。我在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}