个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我希望我的博客页面播放随机音乐轨道，当轨道结束时，后面会播放另一个随机选择的音乐轨道。
这是我尝试过的:
<html>
<body>
<div id="soundtrack"></div>
<script type="text/javascript">
var a = Math.random()*3;
a = Math.floor(a);
if(a==0)
{
document.getElementById('soundtrack')
.innerHTML="<audio autoplay><source src='s0000.mp3' type='audio/mp3'>Your browser does not support the audio element.</audio>";
}
if(a==1)
{
alert(a);
document.getElementById('soundtrack')
.innerHTML="<audio autoplay><source src='s0001.mp3' type='audio/mp3'>Your browser does not support the audio element.</audio>";
}
if(a==2)
{
document.getElementById('soundtrack')
.innerHTML="<audio autoplay><source src='s0002.mp3' type='audio/mp3'>Your browser does not support the audio element.</audio>";
}
</script>
</body>
</html>
最佳答案
您应该使用 ended音频事件处理程序
试试这个。
<html>
<body>
Random Audio Demo
<div >
<audio id="soundtrack" autoplay>
<source src='https://archive.org/download/kkkfffbird_yahoo_Beep_201607/beep.mp3' type='audio/mp3'>
Your browser does not support the audio element.</audio>
</div>
<script type="text/javascript">
var audio = document.getElementById('soundtrack'),
music = [
'https://archive.org/download/kkkfffbird_yahoo_Beep_201607/beep.mp3',
'https://archive.org/download/Beep_7/beep.mp3',
'https://archive.org/download/beep-07/beep-07.mp3'
];
audio.addEventListener('ended', function(e) {
var r = Math.floor(Math.random()*3);
audio.src = music[r];
});
</script>
</body>
</html>关于javascript - 如何在我的博客页面上一个接一个地播放随机音乐轨道？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42468004/
24
4
0
我是一名优秀的程序员,十分优秀！