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

前端之家收集整理的这篇文章主要介绍了JS+html5制作简单音乐播放器前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

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

1.HTML

几个主要的标签如下:





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

2.js

dio.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播放器的播放,暂停,上一首和下一首功能了。

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

原文链接:https://www.f2er.com/js/40333.html

猜你在找的JavaScript相关文章