JS+html5制作简单音乐播放器

JavaScript 2019-01-07

本教程为大家分享了JS音乐播放器的具体代码，供大家参考，具体内容如下

1.HTML

几个主要的标签如下：

rush:xhtml;">

这里不提供CSS样式，只做功能说明。

2.js

rush:js;"> 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 = "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 = "music/"+music[num]+".mp3";
name.innerHTML = music[num];
audio.play();
}

这样就可以控制audio播放器的播放，暂停，上一首和下一首功能了。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

音乐播放器