以下是我的代码

<video class="video" id="myVideo" controls>
  <source src="images/UnlimitedTeamVideo.mp4" type="video/mp4">
  <source src="UnlimitedTeamVideo.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>


<script type="text/javascript">
  $(document).ready(function(){   
   $("#myVideo").bind('ended', function(){
      location.href="homepage.php";   
   }); 
  });
</script>

Answer 1

尝试：

<video class="video" id="myVideo" autoplay>

如果浏览器支持其中一个来源并且能够缓冲它，autoplay属性应该会自动让浏览器播放视频。

显示加载/进度条 this answer may help 。基本上它使用buffered对象来显示视频的加载部分。

Answer 2

1 - 我想在用户访问我的网站时自动启动我的视频。

使用autoplay属性。有关有效HTML5视频属性的列表，请参阅here。请注意，这不适用于iOS和Android - 这是design。

2-虽然目前正在显示，但无需控制，因为当我删除它时，我的视频根本无法显示。

您需要为HTML5视频代码指定宽度和高度才能使其按预期工作

3-我可以显示加载栏或任何加载图像，因此当它处于加载范围内时，用户可以看到加载栏，它可以显示视频存在。

是的，你可以。您的案例场景的想法是在文档准备好时显示加载栏，并在play事件触发时将其删除。您可以查看媒体元素事件列表here。

所有在一起：

<video class="video" id="myVideo" width="640" height="360" autoplay>
  <source src="images/UnlimitedTeamVideo.mp4" type="video/mp4">
  <source src="UnlimitedTeamVideo.ogg" type="video/ogg">
   Your browser does not support the video tag.
</video>
<div id="loadingSpin">Loading...</div>
<script type="text/javascript">
$(document).ready(function(){  
    $("#loadingSpin").show(); 
    $("#myVideo").bind('play', function(){
        $("#loadingSpin").hide();
     });
    $("#myVideo").bind('ended', function(){
      location.href="homepage.php";   
     }); 
});
</script>

你需要在CSS中放置和设置loadingSpin项目，但我猜你可以从这里开始：）

HTML 5视频 - 无需控制和自动重定向选项自动启动

以下是我的代码

2 个答案: