Menu
I have a html video, and I am wanting to run a function when a video ends. I have tried the following but I get nothing:
$(document).ready(function(){
$('video').live('ended',function(){
alert('video ended');
});
});
Any ideas why this isn't triggering at the end of a video? Or have I not provided enough information to answer anything here?
Note: I'm using live() function and not on() because of the need for jQuery 1.7 with this project.
882
For your paste & copy pleasure the jQuery solution:
<video width="320" height="240">
<source src="movie.mp4" type="video/mp4">
</video>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>/*<![CDATA[*/
$(document).ready(function(){
$('video').on('ended',function(){
console.log('Video has ended!');
});
});
/*]]>*/</script>Replace the 'video'-part with the correct selector for your video.
EDIT: Here is the solution without jQuery:
<video width="320" height="240">
<source src="movie.mp4" type="video/mp4">
</video>
<script>/*<![CDATA[*/
document.querySelector('video').addEventListener('ended',function(){
console.log('Video has ended!');
}, false);
/*]]>*/</script>Replace the 'video'-part with the correct selector for your video.
172
<html>
<head>
<title></title>
<script>
function videoEnded() {
alert('video ended');
}
</script>
</head>
<body>
<video src="video/endscene.mp4" id="video" controls onended="videoEnded()">
video not supported
</video>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
