HTML5音频结束功能[重复]

Posted 2023-02-25

【中文标题】HTML5音频结束功能[重复]

【英文标题】：HTML5 audio ended function [duplicate]

【发布时间】：2013-01-11 03:14:48

【问题描述】：

可能重复：html5 audio element with dynamic source

我正试图让播放器在当前曲目结束后重新加载新曲目，但我想我可能做错了什么。

这是播放器：

<audio id="audio" autoplay controls="controls" onclick="start()">
<source src="song.php" type="audio/mpeg" />
</audio>

这是脚本：

function start()
    var audio = document.getElementById('audio');
    audio.play();
    audio.addEventListener('ended',function()
        $.post("song.php", function(result)
        audio.src = result;
        audio.pause();
        audio.load();
        audio.play();
    );
    );

如果我将脚本更改为此，它可以工作...但我不想重新加载整个页面：

function start()
    var audio = document.getElementById('audio');
    audio.play();
    audio.addEventListener('ended',function()
        window.location = 'player.html';
    );

【参考方案1】：

对于初学者，每次单击元素时都会附加一个新的事件处理程序。如果有人经常暂停音乐，他们就会遇到问题。

请试试这个：

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

我假设song.php 是一个返回音频数据的PHP 文件。 nocache 查询参数将确保每次都实际调用该文件。

【讨论】：

谢谢！这就是我要找的:)

如果你也想把这个作为***.com/questions/14190160/…的答案，我也会接受它。