ajax video 自动播放,解决ios微信浏览器中audio和video音乐视频无法自动播放等问题...

产生问题的原因

参考网址:点击

对于自动播放的局限性,没有变通方案。正如前面所提及的,音频流只能从用户触摸事件加载。当针对移动版 Safari 进行开发时,重要的一点是要在必要时调整您的工作流,以适应这个局限性。(以我的经验来看,我知道如果在一开始没有将这些考虑在内,那么将来会发生很多重构。)

在 iOS 4.2.1 之前,可以从一个同步 Ajax 调用的回调来加载音频文件,如下所示。

// run on page load

var audio = document.getElementById('audio');

jQuery.ajax({

url: 'ajax.js',

async: false,

success: function() {

audio.play(); // audio will play in iOS before 4.2.1

}

});

上述方法存在一个问题:因它是一个同步 Ajax 调用,所以浏览器是锁定的,直到调用结束为止。在移动版 Safari 中,锁定并不只是意味着页面锁定,整个应用程序都会锁定。如果有错误发生,并且移动版 Safari 陷入锁定状态(可能性不是很大),那么退出浏览器的惟一方式是单击 home 按钮并强制关闭应用程序。

因此,Apple 在 iOS 4.2.1 中修复了这种变通方式,所以这种变通方法在 iOS 4.2.1 和后续版本中是不起作用的。

无法自动播放解决方法

调用微信jssdk的功能来实现自动播放

function audioAutoPlay(id){

var audio = document.getElementById(id);

audio.play();

document.addEventListener("WeixinJSBridgeReady", function () {

audio.play();

}, false);

document.addEventListener('YixinJSBridgeReady', function() {

audio.play();

}, false);

}

audioAutoPlay('AudioId');

无法通过ajax异步控制播放的解决方法

取消异步,改成ajax同步async:false,

var audio = document.getElementById('audio');

jQuery.ajax({

url: 'ajax.js',

async: false,

success: function() {

audio.play(); // 这种方法在IOS4.2.1之前能正常播放

}

});

使用setTimeout来定时播放,延时时间1毫秒

var audio = document.getElementById('audio');

jQuery.ajax({

url: 'ajax.js',

async: false,

success: function() {

setTimeout(function(){

audio.play();

},1);// 这种方法适应所有版本的IOS

}

});

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值