实现视频自动播放功能 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Static Template</title>
    <style>
      body {
        margin: 0;
      }
    </style>
  </head>
  <body>
    <video
      id="video"
      onloadeddata="this.play();"
      poster="poster.png"
      autoplay="autoplay"
      playsinline
      loop
      muted
      controls
    >
      <source
        src="https://v.geilicdn.com/video/template1620887566-2cc60000017fd99651050a207569.mp4.f20.mp4"
        type="video/mp4"
      />
      Your browser does not support the video tag or the file format of this
      video.
    </video>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script>
      var video = document.getElementById("video");
      document.addEventListener(
        "WeixinJSBridgeReady",
        function () {
          video.play();
        },
        false
      );
      video
        .play()
        .then((res) => {
          console.log(11111);
        })
        .catch((e) => {
          alert("不能自动播放");
          video.play();
          video.muted = true;
          video.pause();
          video.play();
        });
    </script>
  </body>
</html>

 

posted @ 2022-03-30 18:26  zt123123  阅读(415)  评论(0)    收藏  举报