微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

本教程为大家分享了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播放器的播放,暂停,上一首和下一首功能了。

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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐