html5 video微信浏览器视频不能自动播放解决方案

IOS解决方案

核心js
需要引用微信sdk

 //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以 document.getElementById(‘car_audio‘).play(); //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 document.addEventListener("WeixinJSBridgeReady", function () { document.getElementById(‘car_audio‘).play(); document.getElementById(‘video‘).play(); }, false);

示例

html5 video微信浏览器视频不能自动播放解决方案
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"> <link rel="stylesheet" type="text/css" href="style/style.css" /> <script src="js/jquery1.11.0.js"></script> <title>520宣言 让爱增值</title> <script> setRem(); window.addEventListener(‘orientationchange‘, setRem); window.addEventListener(‘resize‘, setRem); function setRem() { var html = document.querySelector(‘html‘); var width = html.getBoundingClientRect().width; html.style.fontSize = width / 20 + ‘px‘; } </script> <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> <script src="js/wechat.share.js"></script></head><body> <div class="top psa"><img src="images/top.png" /></div> <div class="title psa"><img src="images/title.png" alt="" /></div> <div class="center psa"><img src="images/center.png" alt="" /></div> <div class="bottom psa"><img src="images/bottom.png" alt="" /></div> <video id="car_audio" class="pv-video psa" poster="images/bg.png" preload="preload" autoplay="true" x-webkit-airplay="allow" x5-playsinline="" webkit-playsinline="" playsinline="true" src="https://dpv.videocc.net/a4cd7a4736/5/a4cd7a4736b31722fb752c4db6e059b5_2.mp4?pid=1589536746708X1809765" controls=‘true‘></video></body><script> //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以 document.getElementById(‘car_audio‘).play(); //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效 document.addEventListener("WeixinJSBridgeReady", function () { document.getElementById(‘car_audio‘).play(); document.getElementById(‘video‘).play(); }, false);</script></html>

相关文章