HTML内容
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript">
<!--播放-->
window.onload=function(){
var btn1 = document.getElementById("btn-play");
btn1.onclick = function(){
if(audio.paused){
audio.play();
}
}
<!--暂停-->
var btn2 = document.getElementById("btn-stop");
btn2.onclick = function(){
if(audio.played){
audio.pause();
}
}
var music = new Array();
music = ["灰白 - 君辞云梦泽","灰白- 双璧","小柯- 丰碑","炎上 - 小冤家"];//歌单
var num = 0;
var name = document.getElementById("name");
<!--上一首-->
var btn3 = document.getElementById("btn-pre");
btn3.onclick = function(){
num = (num +2)%3;
audio.src = "E:/下载/酷狗音乐/music/"+music[num]+".mp3";
name.innerHTML = music[num];
audio.play();
}
<!--下一首-->
var btn4 = document.getElementById("btn-next");
btn4.onclick = function(){
num = (num +1)%3;
audio.src = "E:/下载/酷狗音乐/music/"+music[num]+".mp3";
name.innerHTML = music[num];
audio.play();
}
}
</script>
</head>
<div>
<h4 id="name">灰白 - 君辞云梦泽</h4>
<br>
<audio id="audio" src="E:/下载/酷狗音乐/music/灰白 - 君辞云梦泽.mp3 " controls autoplay></audio><br/>
</div>
<div>
<button id="btn-play" >播放</button>
<button id="btn-stop" >暂停</button>
<button id="btn-pre" >上一首</button>
<button id="btn-next" >下一首</button>
</div>
<body>
</body>
</html>
结果显示