播放視頻，然后重定向到新頁面

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(); ，因為您在<video>標記中具有autoplay="autoplay"屬性。 閱讀關於它在這里和自己嘗試一下這里 。

第三，在編寫js代碼時，請保持瀏覽器控制台處於打開狀態。

祝好運！