HTML5 audio element with dynamic source(具有动态源的 HTML5 音频元素)
问题描述
我有一个基本的音频播放器:
I have a basic audio player:
<audio controls="controls" autoplay="true" loop="loop">
<source src="song.php" type="audio/mpeg" />
</audio>
而不是直接指向 MP3 文件的源代码,我让它指向一个 PHP 文件,然后该文件指向 MP3 文件,该文件有效.但是,当当前曲目结束时,PHP 文件将指向一个新的 MP3 文件.所以,我遇到的问题是,当播放器使用新的 MP3 文件循环播放时,它完全停止工作.有没有办法解决?有没有办法通过播放列表或任何其他播放器来做到这一点?
And instead of the source pointing directly to the MP3 file I have it pointed at a PHP file which then points to the MP3 file, which works. But, when the current track is over the PHP file is pointing to a new MP3 file. So, the problem that I have is that when the player goes to loop, with the new MP3 file, it completely stops working. Is there any way around this? Is there a way to do this with a playlist or any other players?
推荐答案
复制自您的重复问题一个>:
对于初学者来说,每次单击元素时都会附加一个新的事件处理程序.如果有人经常暂停音乐,他们就会遇到问题.
For starters, you are attaching a new event handler every single time the element is clicked. If someone frequently pauses the music, they will run into problems.
相反,试试这个:
<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
查询参数将确保每次实际调用该文件.
I'm assuming that song.php
is a PHP file that returns the audio data. The nocache
query parameter will ensure that the file is actually called every time.
这篇关于具有动态源的 HTML5 音频元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:具有动态源的 HTML5 音频元素
基础教程推荐
- 在 yii2 中迁移时出现异常“找不到驱动程序" 2022-01-01
- 如何在 Symfony 和 Doctrine 中实现多对多和一对多? 2022-01-01
- 找不到类“AppHttpControllersDB",我也无法使用新模型 2022-01-01
- 如何在 XAMPP 上启用 mysqli? 2021-01-01
- 使用 PDO 转义列名 2021-01-01
- 在 CakePHP 2.0 中使用 Html Helper 时未定义的变量 2021-01-01
- HTTP 与 FTP 上传 2021-01-01
- Doctrine 2 - 在多对多关系中记录更改 2022-01-01
- PHP 守护进程/worker 环境 2022-01-01
- phpmyadmin 错误“#1062 - 密钥 1 的重复条目‘1’" 2022-01-01