Sometimes, we want to detect when an HTML5 video finishes with JavaScript.
In this article, we’ll look at how to detect when an HTML5 video finishes with JavaScript.
How to detect when an HTML5 video finishes with JavaScript?
To detect when an HTML5 video finishes with JavaScript, we listen to the ended event.
For instance, we write
<video src="video.ogv" id="myVideo">video not supported</video>
to add a video element.
Then we write
const onEnded = (e) => {
// ...
};
document.getElementById("myVideo").addEventListener("ended", onEnded, false);
to select the video element with getElementById.
Then we call addEventListener to listen to the ended event.
onEnded is called when the event is triggered after the video finishes playing.
Conclusion
To detect when an HTML5 video finishes with JavaScript, we listen to the ended event.
