Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding event listener to audio HTML5 tag in javascript

Hi I'm creating a new audio tag element in Javascript this is the code:

var audio = document.createElement("audio");
audio.setAttribute("id","myid");
audio.setAttribute("autoplay","autoplay");
document.body.appendChild(audio);

before appending it to the body, I'd like to place an onended event handler, I tried something like this:

audio.onended = foo;

where foo is something like: function foo(){alert('Hola')}

and

audio.setAttribute("onended","foo()");

in both case it didn't work. In the first case the audio tag is appended without any onended event handler; while in the second case the audio tag is appended, the onended event is on the attributes but it does not fire.

does someone have any idea?

thanks in advance.

-z-

like image 742
Zeta Avatar asked Jun 10 '11 22:06

Zeta


People also ask

Can you add an event listener to a function in JavaScript?

You can add event listeners to any DOM object not only HTML elements. i.e the window object. The addEventListener() method makes it easier to control how the event reacts to bubbling.

Can you add an event listener to a class in JavaScript?

Use the document. querySelectorAll() method to select the elements by class. Use the forEach() method to iterate over the collection of elements. Use the addEventListener() method to add an event listener to each element.

Does HTML5 support audio tag?

HTML5 <audio> Tag. Since the release of HTML5, audios can be added to webpages using the “audio” tag.


2 Answers

try:

audio.addEventListener('ended', foo); 

This is the correct and standard method to add event listeners.

like image 63
Variant Avatar answered Oct 14 '22 17:10

Variant


First, make sure whether audio element has the event before you use it, suppose the HTMLAudioElement is audio, you can test it like this audio.hasOwnProperty('onended')

Based on my browser, it doesn't support.

like image 26
user1217010 Avatar answered Oct 14 '22 16:10

user1217010