HTML5视频重定向

HTML5 video redirection

本文关键字：重定向 视频 HTML5      更新时间：2023-09-26

基本上，我想做的是在视频播放结束后将其重定向到另一个网页（与YouTube用于播放列表的内容非常相似）。在问这类问题之前，我试过做一些研究，但似乎对我没有任何效果

这是代码：

<video id="example_video_1" class="video-js vjs-default-skin"
  controls preload="auto" width="854" height="480"
  poster="images/thumbnailbackgrounds/AE-DageSide.jpg"
  data-setup='{"example_option":true}'>
  <source src="files/Clip1.mp4" type='video/mp4' />
</video>

因为看起来你在使用Video.JS，所以你应该看看他们的文档：

https://github.com/videojs/video.js/blob/master/docs/index.md

具体而言，API部分：

https://github.com/videojs/video.js/blob/master/docs/api.md

在"事件"部分，它说：

结束

Fired when the end of the media resource is reached. currentTime == duration

因此，你需要获得你的玩家的参考（也在该页面上）：

var myPlayer = videojs("example_video_1");

然后监听结束的事件，并从那里重定向：

function endedFunction(){
    window.location = 'http://www.example.com/';
}
myPlayer.on("eventName", endedFunction);

借用这个答案，尝试以下操作。你不需要video.js。HTML

<video id="example_video_1" class="video-js vjs-default-skin"
  controls preload="auto" width="854" height="480"
  poster="images/thumbnailbackgrounds/AE-DageSide.jpg"
  data-setup='{"example_option":true}'>
  <source src="files/Clip1.mp4" type='video/mp4' />
</video>

JavaScript

<script>
    var video = document.getElementsByClassName("video-js");
    // Or select element by HTML tag
    // var video = document.getElementsByTagName('video')[0];
    video.onended = function() {
      window.location.href = "www.yoururl.com";
    }
</script>

该工作了。

相关文章：