播放视频,然后重定向到新页面

Question

我有一个WordPress网站,其中包含一个包含视频的页面; 我希望在访问该页面时自动播放此视频,并且在视频播放完毕后,我希望重定向到我网站上的其他页面.

我按照这篇文章的说明: 播放后重定向html5视频

但这似乎对我不起作用,我无法弄清楚我应该做些什么.

这是我页面上当前的代码:

<script src="text/javascript">
function playVideo(){
    var video = document.getElementById('addiction-video');
    video.play();
    video.addEventListener('ended',function(){
    location.href = 'http://mywordpresssite.com/addiction-a-call-for-connection-acim/';
    });
}
</script>
<video id="addiction-video" autoplay="autoplay" controls="controls" width="600" height="300">
<source src="http://mywordpresssite.com/wp-content/uploads/2015/12/Addictions.mp4" type="video/mp4" />
</video>

任何人都可以告诉为什么视频播放结束后它没有重定向？

我直接在我的WordPress页面中有上面的代码; 我已经尝试将脚本放在html下面,我尝试将脚本添加到我的主题设置中,但都没有使它工作.

谢谢!

Answer 1

首先更改<script src="text/javascript">为,<script type="text/javascript">因为您没有导入外部脚本文件.阅读一下<script>标签.

其次,你不需要这个playVideo()功能.相应地重写您的代码:

<script type="text/javascript">

    var video = document.getElementById('addiction-video');

    video.addEventListener('ended',function(){
        location.href = 'http://mywordpresssite.com/addiction-a-call-for-connection-acim/';
    });

</script>
<video id="addiction-video" autoplay="autoplay" controls="controls" width="600" height="300">
    <source src="http://mywordpresssite.com/wp-content/uploads/2015/12/Addictions.mp4" type="video/mp4" />
</video>

您不需要video.play();,因为您autoplay="autoplay"在<video>标签中有属性.阅读关于它在这里和自己尝试一下这里.

第三,在编写js代码时保持浏览器控制台处于打开状态.

祝好运!