0

最初の 2 曲しか再生されず、何も起こりません。なぜそれが2回機能してから停止するのかわかりませんか? 曲の配列を永遠に演奏してもらいたいです。巻き戻しも機能しません。巻き戻しボタンをクリックすると、曲は配列に移動し、それが 0 未満の場合は array.length の曲に移動します。

グローバル:

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;
  }

}
4

2 に答える 2

0

コントロールを使用して 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/

HTML5 オーディオ タグと mp3 の再生は、 IE8および古いバージョンの Firefox ではサポートされていませんでした。

Flash オブジェクトを使用した作業スクリプトの例は次のとおりです: http://pastebin.com/WDzEQGtn

于 2013-06-30T08:12:42.707 に答える
0

どこでcheckClicked定義されていますか？その関数の呼び出しが正しく動作していないようです。

ボタンのクリックのバインドは表示されませんでしたが、とにかく各ボタンを個別にバインドするので、どのボタンがクリックされたかを確認する必要はありません。

于 2013-06-30T08:13:13.630 に答える