Détecter la fin d’une vidéo HTML5

Comment détectez-vous quand un élément HTML5 a fini de jouer?

Vous pouvez append un écouteur d’événement avec «terminée» comme premier paramètre

Comme ça :

   

Jetez un coup d’oeil à tout ce que vous devez savoir sur la vidéo et l’audio HTML5 post sur le site Opera Dev dans la section “Je veux lancer mes propres contrôles”.

Ceci est la section pertinente:

  

alors vous pouvez utiliser:

  

est un événement standard HTML5 sur tous les éléments multimédias, consultez la documentation des événements de l’élément multimédia (vidéo / audio) HTML5 .

JQUERY

 $("#video1").bind("ended", function() { //TO DO: Your code goes here... }); 

HTML

  

Types d’événements Référence HTML du DOM Audio et Vidéo

Voici une approche simple qui se déclenche lorsque la vidéo se termine.

       

Dans la ligne “EventListener”, remplacez le mot “terminée” par “pause” ou “play” pour capturer ces événements.

Voici un exemple complet, j’espère que ça aide =).

 < !DOCTYPE html>       

Vous pouvez append auditeur tous les événements vidéo nicluding ended, loadedmetadata, timeupdate où la fonction ended est appelée à la fin de la vidéo

 $("#myVideo").on("ended", function() { //TO DO: Your code goes here... alert("Video Finished"); }); $("#myVideo").on("loadedmetadata", function() { alert("Video loaded"); this.currentTime = 50;//50 seconds //TO DO: Your code goes here... }); $("#myVideo").on("timeupdate", function() { var cTime=this.currentTime; if(cTime>0 && cTime % 2 == 0)//Alerts every 2 minutes once alert("Video played "+cTime+" minutes"); //TO DO: Your code goes here... var perc=cTime * 100 / this.duration; if(perc % 10 == 0)//Alerts when every 10% watched alert("Video played "+ perc +"%"); }); 
 < !DOCTYPE html>