ios微信客戶端中聲音無法播放

html中audio標籤

<audio src="http://wx.masrbs.com/Addons/HFive/View/default/Public/music/flipsound.mp3" id="Jaudio" class="media-audio" preload="preload" ></audio>

js中播放代碼

app.audioAutoPlay=function(id){
    var audio = document.getElementById(id),
    play = function(){
        audio.play();
        //document.removeEventListener("touchstart",play, false);
    };
    audio.play();
    document.addEventListener("WeixinJSBridgeReady", function () {
        play();
    }, false);
    //document.addEventListener("touchstart",play, false);
}

在ios中點擊按鈕觸發聲音播放是可以的，但是在滑動屏幕代碼中調用播放聲音代碼是無效的。在andriod下都沒有問題。

網上查找了很多資料，發現以下兩段話：

1. 上面的解決方案的核心是利用了微信在ready的時候會有個WeixinJSBridgeReady/YixinJSBridgeReady事件，通過監聽這個事件來觸發的。那有個坑就是如果微信已經ready了，但還沒執行到你監聽這個ready事件的代碼，那麼你的監聽是沒用的，所以監聽的js一定要放在head的開始位置(放在css外鏈之前)，確保最先執行，切記！切記！。重要的事情說三遍。
2. 另一個點就是，本文的解決方案只適合一開始就播放的背景音樂。如果你是做那種微信場景（打開頁面模擬收到很多條微信，每條微信都要播放那段音效），實際上本文的解決方案是不行的。因爲ready的事件只會執行一次，即使你在ready事件裏面用setTimeout或者setInterval也可能會導致丟失情況。

window.onload=function(){
var shakeMusic = document.getElementById("Jaudio");
console.log(shakeMusic);
// 微信提供的事件，微信瀏覽器內部初始化完成後
document.addEventListener("WeixinJSBridgeReady", function () {
 shakeMusic.load();
}, false);

};

此段代碼放入setTimeout函數中，無法監聽weixinjsbridgeready事件的。我的頁面執行是先執行加載資源文件，加載完畢渲染頁面，將監聽代碼放入加載完畢渲染頁面方法中也無效。

 將以上代碼加載滑動播放聲音代碼之前，問題解決。