Question

我在下面有一个示例代码，可以在新标签中播放视频。当通过桌面访问网站时，这非常适用。但是，当移动浏览器访问该页面时，视频不会在不同的选项卡中播放。

<html>
</head>
    <body>
        <h1>Video testing</h1>
        <a href="test.MP4" target="_blank" >
        <video id="test" width="320" height="240" controls>
        <source id="file" src="test.MP4" type="video/mp4">
         Your browser does not support the video tag.
        </video>
        </a>

  <script type="text/javascript">
  var fullscreen = document.getElementById('play-fullscreen'),
  player = document.getElementById('test'),
  _file = document.getElementById('file');

  fullscreen.addEventListener('click', function (e) {
  if (~_file.src.indexOf('?')) 
     player.src = _file.src + '&autoplay=1';
  else player.src = _file.src +'?autoplay=1';

  var req = player.requestFullscreen
    || player.webkitRequestFullscreen
    || player.mozRequestFullScreen
    || player.msRequestFullscreen;
  req.call(player);
  var playPromise = player.play();

  if (playPromise !== undefined) {
    playPromise.then(function() {

    }).catch(function(error) {

    });
  }
  e.preventDefault();
});
</script>
</body>
</html>

如果可以提供任何解决方案以便通过移动浏览器以相同的方式工作，那将非常有用。

当通过移动设备访问网页时，视频不会在新标签中播放

0 个答案: