H5:设置video自动播放

HTML:

<video id="myVideo" src="" poster="" autoplay muted preload controls="controls" webkit-playsinline="webkit-playsinline" playsinline>
  <!--<source type="video/mp4" src="" >-->
</video>

注意这里的 muted ,如果不加的话,在普通的浏览器当中是不会自动播放的,但是存在缺陷,自动播放的话会默认静音。
在之前的项目里,我这里的界面是用web-view嵌套在微信小程序使用的,所以就将 muted 去掉了,然后通过微信的 WeixinJSBridgeReady 方法来唤起video的自动播放,可以实现有声播放。

JS:

  autoPlayAudio("myVideo");
  
  function autoPlayAudio(id) {
        var video = document.getElementById(id);//video标签id=media

        if (window.WeixinJSBridge) {
            WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                video.load();
                video.play();
            }, false);
        } else {
            document.addEventListener("WeixinJSBridgeReady", function () {
                WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
                    video.load();
                    video.play();
                });
            }, false);
        }
        video.load();
        video.play();

        return false;
   }

推荐阅读更多精彩内容