代码较最基础的播放器实现增加了playlist，使用MakeList实现多首播放，有需要的可以直接使用：
Untitled Page
/*************************************************************
LovelyLife Player V1.0
Edited By LovelyLife
At -09-16
All rights reservered
Code Start
Modify by /
*************************************************************/
var playid = "LovelyLifePlayer"
var status = "status"
var curId,arrPL,selected
var isStop,isLoop
arrPL = new Array() //播放器列表
cur = 0
curId = 0
isStop = false
selected = 0
isLoop = true
function songObj(Id,url, name){
this.Id = Id
this.url = url
this.name = name
}
function playAndpauseIt(){
if(document.getElementById(status).innerText == '暂停'){
document.getElementById(playid).controls.pause()
document.getElementById(status).innerHTML ='播放'
}
else{ document.getElementById(status).innerText = '暂停'
document.getElementById(playid).controls.play()}
}
function stopIt(){
isStop = true
document.getElementById(status).innerHTML ='播放'
document.getElementById(playid).controls.stop()
}
function showTimer(){
var cp=document.getElementById(playid).controls.currentPosition
var cps=document.getElementById(playid).controls.currentPositionString
var dur=document.getElementById(playid).currentMedia.duration;
var durs=document.getElementById(playid).currentMedia.durationString;
var s = document.getElementById(playid).playState
var o = document.getElementById(playid).openState
if( s==2 || s==3)
document.getElementById('pos').innerText = " " + cps + "/" + durs + " "
else
document.getElementById('pos').innerText = " 00:00/" + durs + " "
if( s == 1 ){
if(isLoop && (curId > (arrPL.length - 1))){
curId = 0
return 0
}
clearIt()
if(curId<0 || curId>arrPL.length){
alert("当前没有歌曲！，请查看播放列表！")
return false
}
nxtPlay()
}
if( s == 10 && arrPL.length >0 )
nxtPlay()
}
function nxtPlay(){
isStop = true
if(curId > arrPL.length - 1){
document.getElementById("songName").innerText = "没有歌曲了，请选择上一曲!"
document.getElementById(playid).URL = "NULL"
return false
}
curId++
clearIt()
setIt(curId)
PlayIt(curId)
}
function prePlay(){
isStop = true
if(curId<0){
document.getElementById("songName").innerText = "没有歌曲了，请选择下一曲!"
document.getElementById(playid).URL = "NULL"
return false
}
curId--
clearIt()
setIt(curId)
PlayIt(curId)
}
function PlayIt(cid){
if(curId<0 || curId>arrPL.length -1){
document.getElementById("songName").innerText = "当前没有歌曲！，请查看播放列表！"
return false
}
url = arrPL[cid].url;
curId = cid
if(url == "None"){
document.getElementById("songName").innerText = "加载歌曲未找到!播放下一曲！"
nxtPlay()
return false
}
document.getElementById(playid).URL = url
document.getElementById("songName").innerText = arrPL[cid].name
}
function clearIt(){
if((arrPL.length - 1 <0) || selected < 0 || selected > arrPL.length){
return false
}
}
function setIt(tid){
if(tid<0 || tid>arrPL.length-1){
document.getElementById("songName").innerText = "当前没有歌曲！，请查看播放列表！"
return false
}
}
function InitPlay(songName,url,auto){
var strTemp = "
strTemp += " type=\"application/x-oleobject\" width=\"0\" height=\"0\" id=" + playid
strTemp += " style=\"position:relative; left:0px; top:0px; width:0px; height:0px;\">\n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += " \n"
strTemp += "
\n "
strTemp += "点播的歌曲: " + songName + ""
strTemp += " []"
strTemp += " [播放]"
strTemp += "[停止]"
if((arrPL.length - 2) >= 0){
strTemp += "[上曲]"
strTemp += "[下曲]"
}
strTemp += " "
document.getElementById('player').innerHTML = strTemp
temptimer=setInterval('showTimer()',1000);
}
function playX(cur){
PlayIt(cur)
clearIt()
setIt(cur)
curId = cur
selected = cur
}
function MakeList(Id,Url,Name){
arrPL[cur] = new songObj(Id,Url, Name)
cur++
}
function loopIt(){
if(isLoop){
document.getElementById('sloop').innerText = "不循环"
isLoop = false
}else{
document.getElementById('sloop').innerText = "循环播放"
isLoop = true
}
}
/* Code End */
window.attachEvent('onload', function(){
InitPlay("女人如烟[词曲：穆真 演唱：魏佳艺]","/yy/nrry.mp3", 1);
playAndpauseIt();
})
MakeList(1,"/yy/nrry.mp3","111");
MakeList(2,"/sourcefile/0/0/2/2958.wma","222");
MakeList(3,"/rm0402/q/258.rm","333");
MakeList(4,"/sourcefile/0/0/2/2958.wma","4444");
MakeList参数：共3个参数，第一个是ID,第二个参数是音乐的URL地址，第三个参数是歌曲的名称。说明都写在注释里了，欢迎大家阅读和参考。
本条技术文章来源于互联网，如果无意侵犯您的权益请点击此处反馈版权投诉
本文系统来源：php中文网
如果觉得《html带列表音乐播放器 JavaScript实现带播放列表的音乐播放器实例分享》对你有帮助，请点赞、收藏，并留下你的观点哦！
