HTML DOM onended Event
Last Updated :
22 Jun, 2023
The HTML DOM onended event occurs when the audio/video is ended. We can add some custom messages in this event like “Thank for watching”, “Share”, etc.
Supported Tags:
Syntax:
In HTML:
<element onended="myScript">
In JavaScript:
object.onended = function(){myScript};
In JavaScript, using the addEventListener() method:
object.addEventListener("ended", myScript);
Example: Using HTML
HTML
<!DOCTYPE html>
< html >
< body >
< center >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h2 >
HTML DOM onended Event
</ h2 >
< audio controls onended = "gfgFun()" >
< source src = "beep.mp3"
type = "audio/mpeg" >
</ audio >
< script >
function gfgFun() {
alert("Thanks for listening");
}
</ script >
</ center >
</ body >
</ html >
|
Output:
Example: Using JavaScript
HTML
<!DOCTYPE html>
< html >
< body >
< center >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h2 >HTML DOM onended Event</ h2 >
< audio id = "audioId" controls>
< source src = "beep.mp3"
type = "audio/mpeg" >
</ audio >
< p id = "try" ></ p >
< script >
document.getElementById(
"audioId").onended =
function () {
gfgFun()
};
function gfgFun() {
document.getElementById(
"try").innerHTML =
"Thanks for listening";
}
</ script >
</ center >
</ body >
</ html >
|
Output:
Example: Using the addEventListener() method
html
<!DOCTYPE html>
< html >
< body >
< center >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h2 >HTML DOM onended Event</ h2 >
< audio id = "audioId" controls>
< source src = "beep.mp3" type = "audio/mpeg" >
</ audio >
< p id = "demo" ></ p >
< script >
document.getElementById(
"audioId")
.addEventListener("ended", gfgFun);
function gfgFun() {
document.getElementById(
"demo").innerHTML =
"Thanks for listening";
}
</ script >
</ center >
</ body >
</ html >
|
Output:
Supported Browsers: The browsers supported by HTML DOM onended Event are listed below:
- Google Chrome
- Internet Explorer 9.0
- Firefox
- Apple Safari
- Opera
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...