问题1:在IOS最新的微信6.5.3上,无法播放,在老版本或者安卓版上可以
原因:这个版本的IOS微信对H5的语音播放貌似做了严格的控制,一定需要有一个用户事件触发播放之后,才允许代码控制语音。而摇动手机的事件,是JS库模拟的一个事件,非用户事件,无法完成语音的播放。
解决方案:发现微信SDK的ready事件在其自带浏览器中被当成了用户事件级别,因此这个事件的处理代码中能够有效播放音频。因此
wx.ready(function () { playAudio() })
@H_403_9@这样,之后的shake事件能够播放音频。但是,最好能在ready中静默的播放音频,毕竟这里不是用户在摇动手机。
问题2:IOS中无法对audio进行音量控制,即
audio.volume = 0
无效。因此这段代码无法完成静默播放:wx.ready(function () { setAudioVolumeAsZero() playAudio() })
@H_403_9@解决方案:
wx.ready(function () { playAudio() pauseAudio() })
@H_403_9@必须先playpause一下,不能够直接play,否则还是无法播放
全部代码:
@H_403_9@
dio src="kaka.mp3" id="kaka"> function playKaka (mute) { var kaka = document.getElementById('kaka') kaka.play() mute && kaka.pause() }
@H_403_9@function initWX () {
wx.config()
wx.ready(function () {
playKaka(true)
})
}function initShakeEvent () {
var shake = new Shake()
window.addEventListener('shake',function () {
playKaka()
},false)
shake.start()
}$(function () {
initWX()
initShakeEvent()
})