audio / video 媒体标签在IOS端触发不了的两种解决方法,亲测有效~
什么??音视频标签在IOS手机上播放不了,你一定踩了这个坑,来看看怎么解决吧~
·
问题根源:
可以看到这样一句话,意思是:桌面端的 Safari 5.0 及更高版本支持预加载属性。IOS上的 Safari 从不预加载!
这将会导致媒体标签在IOS中不会自动加载音视频,所以 oncanplay、oncanplaythrough 事件不会自动执行
解决方案
方案一:
直接告诉浏览器我要加载该音视频,load 方法,此时 oncanplay、oncanplaythrough 事件是可以触发的
var $audio = new Audio()
$audio.src = url
$audio.load()
$audio.addEventListener('canplay', () => {
// dosomething...
})
同一个界面多音频时,媒体标签
new Audio()只需一个就行了,只需要点击页面中的音频后,将src赋值为对应音频的资源地址即可
方案二:
监听当前音视频时长是否发生变化,如果发生变化,就说明准备好了;用 ondurationchange 事件 代替 oncanplay 事件即可
var $audio = new Audio()
$audio.src = url
$audio.addEventListener('durationchange', () => {
// dosomething...
})
ok~测试通过,完美解决IOS上的疑难杂症!
更多推荐


所有评论(0)