播放后重定向html5视频

Question

我有一个html 5视频,我删除了控制按钮并添加了一个js代码,以便用户在点击视频时播放视频.我需要做的是绑定一个额外的脚本,在播放视频后重定向页面而不重新加载页面.下面是我的js代码.

function play(){
var video = document.getElementById('video');
video.addEventListener('click',function(){
video.play();
},false);
}

这是我的HTML5视频代码

<video id="video" width="770" height="882" onclick="play();">
<source src="video/Motion.mp4" type="video/mp4" />
</video>

Answer 1

<script src="text/javascript">
// Do not name the function "play()"
function playVideo(){
    var video = document.getElementById('video');
    video.play();
    video.addEventListener('ended',function(){
        window.location = 'http://www.google.com';
    });
}
</script>
<video controls id="video" width="770" height="882" onclick="playVideo()">
    <source src="video/Motion.mp4" type="video/mp4" />
</video>

以下是您可以绑定的媒体事件列表:http://dev.w3.org/html5/spec/Overview.html#mediaevents

Answer 2

我在另一个网站上发现了这个.它似乎运作良好......

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js">
    </script>
    <script type="text/javascript">
      $(document).ready(function(){   
       $("#myVideo").bind('ended', function(){
          location.href="http://www.localhost.com";   
       }); 
      });
    </script>

    <video id="myVideo" width="320" height="240" controls="controls">
      <source src="movie.mp4" type="video/mp4" />
      <source src="movie.ogg" type="video/ogg" />
        Your browser does not support the video tag.
    </video>