当html 5音频文件播放完毕后，重定向到新页面

Question

我正在播放带有文本的有声读物章节，并希望它在html5音频文件完成时自动重定向到包含下一章文本和音频的新页面。

我不是程序员，所以我可以使用一些帮助。

我知道我需要使用addEventListener，其结尾函数与下面的内容类似，但我不知道如何修改它来调用新页面而不是新的音频文件。

<audio id="audio" autoplay controls src="song1.mp3" type="audio/mpeg"></audio>
<script type="text/javascript">
    document.getElementById('audio').addEventListener("ended",function() {
    this.src = "song2.mp3?nocache="+new Date().getTime();
    this.play();
    });
</script>

Answer 1

使用ended事件并重定向：

http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#event-media-ended

function redirectHandler() {
  window.location = 'http://example.com';
}

audio.addEventListener('ended', redirectHandler, false);

演示：http://jsfiddle.net/tqam3zyf/2/

Answer 2

使用时

this.src = "song2.mp3?nocache="+new Date().getTime();
this.play();

设置音频元素的当前来源。

如果您想加载新页面而不是当前页面，可以使用：

window.location = "your_url";