How do you detect when HTML5 audio has finished playing (more than once)?

audio, html, javascript, jquery

Solution

The `ended` event is created based on `.currentTime` attribute. http://w3c.github.io/html/semantics-embedded-content.html#eventdef-media-ended

So, all you have to do is set the `.currentTime` to zero again.

myAudio.addEventListener("ended", function(){
     myAudio.currentTime = 0;
     console.log("ended");
});

Problem

I am having a problem detecting when an tag is finished playing an mp3. When I do something like this: ``` myAudio.addEventListener("ended", function() { alert("ended"); }); ``` It only occurs the first time the audio is played. When I play the audio again, nothing happens. The same thing happens when I use the `onended=doThis();` method. I've heard maybe there is a way to do it in jQuery, but I haven't been able to get it to work. I've also heard there might be a way to fix it by changing the audio div `id` every time the mp3 is played, but this doesn't work for me because I need the `id` to stay the same. Did anyone get any ideas?

Original source

Related problems