html5音樂歌曲只播放前兩個數組？

只有前兩首歌曲在播放，所以沒有任何反應。我不確定它爲什麼會兩次工作然後停下來？我希望它能讓玩家永遠經歷一連串的歌曲。我無法讓我的倒帶也奏效，我想要它，所以當你點擊倒帶按鈕時，歌曲進入 - 對於數組，如果它小於0，它將進入array.length歌曲。html5音樂歌曲只播放前兩個數組？

全局：

var btnPlay = new Button(561,743,33,92); 
var btnRewind = new Button(0,0,800,300); //entire canvas just to test 

var song1 = new Audio("songs/loop1.mp3"); 
var song2 = new Audio("songs/loop2.mp3"); 
var song3 = new Audio("songs/loop3.mp3"); 
var song4 = new Audio("songs/loop4.mp3"); 
var song5 = new Audio("songs/loop5.mp3"); 
var song6 = new Audio("songs/loop6.mp3"); 
var song7 = new Audio("songs/loop7.mp3"); 
var song8 = new Audio("songs/loop8.mp3"); 
var song9 = new Audio("songs/loop9.mp3"); 
var song10 = new Audio("songs/loop10.mp3"); 
var song11 = new Audio("songs/loop11.mp3"); 
var rewindClicked = false; 
var songList = []; 
var currentSong = 1; 

songList.push(song1,song2,song3,song4,song5,song6,song7,song8,song9,song10,song11); 

var song = songList[0];

後退按鈕按下方法：

function mouseClickedButtons(e) 
{ 
alert("hi"); //works 
    if(btnRewind.checkClicked()) 
    { 
    alert("hey"); //does not 
    rewindClicked = true; 
    NextSong(); 

    } 

}

改變歌曲的方法：

function NextSong() 
{ 
document.removeEventListener('ended',NextSong); 

if(rewindClicked ==true) 
{ 
currentSong--; 
} 
else 
{ 
currentSong++; 
} 

if(currentSong > songList.length); 
{ 
currentSong = 1; 
} 

if(currentSong < 0) 
{ 
currentSong = songList.length; 
} 

songList[currentSong].play(); 
rewindClicked = false; 




songList[currentSong].addEventListener('ended', NextSong); 
}

聽衆：

song.addEventListener('ended', NextSong);

按鈕對象（我有一個播放按鈕這個工作，所以它的工作原理）

function Button(xL,xR,yT,yB) 
{ 
this.xLeft = xL; 
this.xRight = xR; 
this.yTop = yT; 
this.yBottom = yB; 
} 



Button.prototype.checkClicked = function() 
{ 

    if(this.xLeft <= mouseX && mouseX <= this.xRight && this.yTop <= mouseY && mouseY <= this.yBottom) 
    { 

    return true; 
    } 

}

來源

2013-06-30 Steve P

您應該讓您的代碼更具可讀性 - 線條之間的空間更少，正確縮進。這只是難以理解的 – jbkkd

你有沒有找到任何解決方案呢？ –

播放HTML5音頻也與控制的基本代碼：

var i = 0; // song index 
var songList = [ 
    'songs/loop1.mp3', 'songs/loop2.mp3', 'songs/loop3.mp3', 'songs/loop4.mp3', 
    'songs/loop5.mp3', 'songs/loop6.mp3', 'songs/loop7.mp3', 'songs/loop8.mp3' 
]; 

// create audio element 
var ae = document.createElement('audio'); 
ae.id = 'audioplayer'; 
ae.src = songList[0]; 
document.body.appendChild(ae); 
// create controls 
var btnPlay = document.createElement('button'); 
var btnPrev = document.createElement('button'); 
var btnNext = document.createElement('button'); 
var testDiv = document.createElement('div'); 
btnPlay.innerHTML = 'Play/Pause'; 
btnPrev.innerHTML = 'Previous song'; 
btnNext.innerHTML = 'Next song'; 
testDiv.id = "test"; 
document.body.appendChild(btnPlay); 
document.body.appendChild(btnPrev); 
document.body.appendChild(btnNext); 
document.body.appendChild(testDiv); 

//add event handlers 
ae.onplay = function() { 
    testDiv.innerHTML = 'Now playing #' + (i+1) + ' ' + songList[i]; 
}; 
ae.onended = function(){ 
    NextSong(); 
}; 
btnPlay.onclick = function() { 
    if (ae.paused) ae.play(); 
    else ae.pause(); 
}; 
btnPrev.onclick = PrevSong; 
btnNext.onclick = NextSong; 
ae.play(); 

function PrevSong() { 
    i = (i > 0)? i - 1 : songList.length - 1; // choose previous index 
    ae.setAttribute("src", songList[i]); 
    ae.play(); 
} 
function NextSong() { 
    i = (i < songList.length - 1)? i + 1 : 0; // choose next index 
    ae.setAttribute("src", songList[i]); 
    ae.play(); 
}

工作小提琴：http://jsfiddle.net/F35Fw/1/

IE8和舊版本的Firefox不支持HTML5音頻標籤和mp3播放，因此爲了向後兼容，您應該使用一些flash-based fallback。工作腳本with the flash object的

例子是在這裏：http://pastebin.com/WDzEQGtn

來源

2013-06-30 08:12:42 Stano