HTML5视频重定向

Question

基本上我要做的就是让视频在完成播放后重定向到不同的网页（非常类似于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>

Answer 1

由于看起来你正在使用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);

Answer 2

从this answer借来的，请尝试以下方法。你不需要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>

应该工作。