HTML5オーディオとjQueryを使用してオブジェクトを呼び出すための参照の使用

Question

再生リストを処理できる独自のHTML5オーディオプレーヤーを作成しています。私はplay()、pause()、stop()とその他の必要な機能を含むカスタムmyPlaylistオブジェクトを作成しました。これはすべて正常に動作していますが、自動的に次のオーディオファイルの再生を開始するために、オーディオファイルがいつ終了したかを知る必要があります。私はそれを行う方法を見つけ出すことができていない

function myPlaylist(){ 

    var player = document.createElement('audio'); 
    var audio = $(player).get(0); 

    this.next = function next(){ 
     // Picks next song in the playlist and plays it 
     ... 
    }; 

    $(audio).bind('ended', function() { 
     alert("Song is finished!"); 
     // Here I want to call to my next() function 
    }); 
} 

：

はここで私が使用しているコードの関連部分です。私はすでに$(this).next()のようないくつかの組み合わせを試しましたが、これは最も妥当と思われますが、実際には警告を表示しますが、何もしません。this.next()また、警告を表示しますが、thisはHTML5オーディオ要素これにはnext()機能がありません。

私も

audio.onended = function(){ 
    alert("Song is finished!"); 
    $(this).next(); 
}; 

を使用して、別のアプローチを試みた。しかし、それらはさらに、アラートをトリガしません。またaudio.endedは機能しません。

私は基本的には今は無理です。誰かが私が間違っていることを知っていますか？前もって感謝します。

ああ、私は

---

のMac OS XにGoogleのChromeとSafariの最新バージョンでは、このすべてをテストしてみたEDITHTML5 audio playlist - how to play a second audio file after the first has ended?に与えられたアドバイスに続いて、私も試してみましたコード

player.addEventListener("ended", function() { 
    alert("Song is finished!"); 
    $(this).next(); 
}); 

そして

player.addEventListener("ended", next); 

次0

最初のアラートは適切に表示されますが、どちらも機能しません。 thisを参照してあらゆる可能性トラブルを取り除くためにしても、私の問題とは何かを持っているかもしれない、私はthis questionに出くわした検索を使用して

---

EDIT 2は、私は新しいを追加しました

function myPlaylist(){ 

    var player = document.createElement('audio'); 
    var audio = $(player).get(0); 
    var me = $(this); 

    this.next = function next(){ 
     // Picks next song in the playlist and plays it 
     ... 
    }; 

    $(audio).bind('ended', function() { 
     alert("Song is finished!"); 
     me.next(); 
    }); 
} 

しかし、その後、私は、オブジェクトのメソッドnext()を持っていないというエラーが出ます：変数ので、今、私は基本的に働いて、オブジェクト自体を参照します。

私は他に何を試すことができるのかわかりません...追加情報は高く評価されます、ありがとう！

Answer 1

endedイベントhereを処理するHTML5プレイリストの例がありますか？

thisを参照してください。この文脈では、thisはイベントを捕捉したDOM要素、つまりaudio要素を参照しています。代わりにこれを試してください：ChromeとSafariで

function myPlaylist(){ 

    var self = this; 
    var player = document.createElement('audio'); 

    this.next = function(){ 
     // Picks next song in the playlist and plays it 
     ... 
    }; 

    player.addEventListener("ended", function() { 
     alert("Song is finished!"); 
     self.next(); 
    }); 

} 

see the MDN for more info on the this keyword