注:重要的事情说三遍, 其他帖子说可以自动播放的我都有试过,一个生效的都没有。
一.微信浏览器(x5内核):
1.不能自动播放
2.全屏
3.最顶层(z层的最顶层)
二.ios系统video自动播放:(经手机测试没有问题可以实现)
<div class="playvideo"><div class="zy_media"><video id="myVideo" muted autoplay poster="https://r1.ykimg.com/05420408584A363C6A0A47047DD24931"data-config='{"mediaTitle": "测试视频--视频"}'><source src="http://www.w3cschool.cc/try/demo_source/mov_bbb.mp4" type="video/mp4">您的浏览器不支持HTML5视频</video></div></div><script>function autoPlayVideo() {/* 自动播放视频效果,解决浏览器或者APP自动播放问题 */function videoInBrowserHandler() {videoPlay(true);document.body.removeEventListener('touchstart', videoInBrowserHandler);}document.body.addEventListener('touchstart', videoInBrowserHandler);/* 自动播放视频效果,解决微信自动播放问题 */function videoInWeixinHandler() {videoPlay(true);document.addEventListener("WeixinJSBridgeReady", function () {videoPlay(true);}, false);document.removeEventListener('DOMContentLoaded', videoInWeixinHandler);}document.addEventListener('DOMContentLoaded', videoInWeixinHandler);}function videoPlay(isPlay) {var media = document.getElementById('myVideo');if (isPlay && media.paused) {media.play();}if (!isPlay && !media.paused) {media.pause();}}</script>三.android系统中解决方案:暂未发现可以实现的例子
误区:(无效的解决方案)
1.设置video属性autoplay;
2.通过js调用play();
3.通过js来触发click事件;
4.使用插件videojs;
5.通过js调用load()然后再调用play();
6.设置video属性webkit-playsinline="true";
7.touchstart监听;
8.stalled事件处理;
9.canplaythrogh事件处理;
10.readyState大于2的处理;
11.DOMContentLoaded监听;
12.微信js api中WeixinJSBridgeReady;
13.微信js api中getNetworkType;
14.白名单;