必须！！！点击后才调用xxx.play()这个方法
但是我们音频链接数据如果是网络请求而来的，那我们可以这样做：
1.在无播放链接的情况下先调用一次xxx.play()，然后暂停xxx.pause()
2.请求到数据以后，替换链接
3.判断readyState的值
0 = HAVE_NOTHING - 没有关于音频是否就绪的信息
1 = HAVE_METADATA - 关于音频就绪的元数据
2 = HAVE_CURRENT_DATA - 关于当前播放位置的数据是可用的，但没有足够的数据来播放下一帧/毫秒
3 = HAVE_FUTURE_DATA - 当前及至少下一帧的数据是可用的
4 = HAVE_ENOUGH_DATA - 可用数据足以开始播放
4.如果readyState===4，调用xxx.currentTime = 0 初始化
5.最后调用xxx.play()
感谢 https://blog.csdn.net/cmyh100/article/details/80695271
给我灵感
我的做法是： 在获取到音频链接前
先执行一次play 然后暂停，最后在获取到音频地址后 将音频时间设置为0 最后重新调用paly()
HTML5 中的audio对象提供可用于通过JavaScript控制播放的方法、属性以及事件。在JavaScript中播放和暂停音频播放
使用HTML5
audio元素可向网页中添加音频，而无需使用外部控件或程序。但是，除非你的网页只需要一个简单的音频播放器，否则你很可能想对加载的音频文件及其播放
拥有更多的控制。若要将audio元素与 JavaScript 结合使用，请定义audio标记，该标记具有 "ID"
并且可以选择省略其他所有内容。你可以显示或隐藏内置控件，或将音频设置为在页面加载时自动播放。使用
JavaScript，你仍然可以执行该操作并且还可以执行进一步操作。
在以下示例中，我们在 HTML 中使用简单的 audio 标记语法。
<input type="text" id="audiofile" size="80" value="demo.mp3" />
音频播放器的所有其他功能可通过JavaScript进行控制，如以下脚本所示。
var currentFile = ""
function playAudio() {
// Check for audio element support.
if (window.HTMLAudioElement) {
try {
var oAudio = document.getElementById('myaudio')
var btn = document.getElementById('play')
var audioURL = document.getElementById('audiofile')
//Skip loading if current file hasn't changed.
if (audioURL.value !== currentFile) {
oAudio.src = audioURL.value
currentFile = audioURL.value
}
// Tests the paused attribute and set state.
if (oAudio.paused) {
oAudio.play()
btn.textContent = "Pause"
}
else {
oAudio.pause()
btn.textContent = "Play"
}
}
catch (e) {
// Fail silently but show in F12 developer tools console
if(window.console &&console.error("Error:" + e))
}
}
}
在示例的 HTML 部分，为audio元素指定id="myaudio" 和源文件"demo.mp3"。定义 id="play" 的按钮和触发 "playAudio()" JavaScript 函数的onclick事件。
在 JavaScript 部分中，使用
document.getElementById返回audio 对象。play和pause方法用于提供播放控制。检索button
对象以便可以在“播放”和“暂停”之间切换按钮标签，具体情况取决于audio 对象的paused属性的状态。 每次调用 "playAudio"
函数时都会检查该状态。 如果音频文件正在播放，则paused属性返回false，并且调用pause方法来暂停播放。按钮标签也设置为“播放”。
如果文件已暂停，则paused属性返回true，并且调用play方法，按钮标签更新为“暂停”。第一次加载文件时，即使尚未显式调用 pause方法，paused属性也返回 true（播放已暂停）。
在HTML代码中，默认情况下按钮处于禁用状态。当页面加载时，在主体标记中使用 onload 事件调用checkSupport() 函数。如果 audio元素存在，则启用按钮。
HTML5中的audio对象有个属性为 ended，改属性是返回音频是否播放结束，是boolean类型的。例如我自己写的一个判断：
this.audioPlay=function(soundPath,callback){
$("#shapeAudio").attr("src",soundPath)
var shapeAudio=document.getElementById("shapeAudio")
shapeAudio.play()
/*判断声音是否播放完成，播放完成之后执行回调函数*/
if(callback != undefined){
var is_playFinish = setInterval(function(){
if(shapeAudio.ended){
callback()
window.clearInterval(is_playFinish)
}
}, 10)
}
}
改判断为当声音播放完成之后再执行回调函数callback
