Captures de la vidéo HTML5 play/stop

Comment puis-je écouter les événements play/stop/pause de la vidéo HTML5?
J'ai essayé avec le code suivant:

$("video").on('play',function(){
    //my code here
});

mais il ne fonctionne pas.

Sinon je serait bien aussi d'intercepter le clic que démarrer et arrêter la vidéo (en fait je préfère), mais même ce code fonctionne pas:

$('video').on('click', function(event) {
    //my code here
});

Je pense que, souvent au-dessus de l'élément vidéo est placé un div avec les événements associés à démarrer et d'arrêter, mais je ne sais pas comment sélectionner via jquery ou javascript:

P. S. Ce code devrait fonctionner sur les pages qui sont composés de manière dynamique /ne sont pas générées par moi, donc je ne peux pas consulter les éléments indiquant leur ID ou une classe spécifique.

Mise à JOUR

Je ne savais pas que la page sur laquelle j'étais essai avait une vidéo à l'intérieur d'un iframe.
La syntaxe est la mieux adaptée à mes besoins:

doc.querySelector("video").addEventListener('play', function(e) {
    //my code here
}, true);

OriginalL'auteur jenjis | 2013-01-10

  1. 1

    Votre première tentative devrait fonctionner. Mais vous devez vous assurer que jQuery est en fait de trouver des éléments de la vidéo. Vous dire que la page est généré dynamiquement, donc peut-être il est possible que votre code est en cours d'exécution avant la vidéo des éléments sont ajoutés. Ce serait également le cas si votre script est plus haut dans le document que les éléments de la vidéo (par exemple, dans le <head>).

    Essayer de placer le code suivant juste avant le code que vous avez là et vérifiez la sortie:

    console.log($("video"));

    Si la sortie est un tableau vide, alors vous n'avez pas trouver tous les éléments de la vidéo. Essayez de placer votre script à la fin de la page, ou à l'intérieur d'un DOMContentLoaded événement. Ou, si un autre script génère les éléments de la vidéo, assurez-vous que votre script s'exécute après que l'un.

    Quelques autres notes sur votre question:

    Il n'y a pas de stop événement. Voici un liste des événements pour les médias.

    Je ne pense pas que le click événement est ce que vous voulez. Qui va se déclencher n'importe où sur la vidéo, l'utilisateur clique sur: bouton de lecture, contrôle du volume, etc.

    La vidéo étant placé à l'intérieur d'un div ne devriez avoir aucun effet sur ces événements. Je ne sais pas pourquoi vous auriez start et end événements sur un div, donc peut-être que je ne suis pas la suite.

    OriginalL'auteur brianchirls

  2. 3

    Voir ici:

    https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Media_events

    Donc... :

    $("video")[0].onplay = function () {
    //Do play stuff here
};

    Espère que ça aide!

    OriginalL'auteur phonicx

  3. 0

    Donner à ceci un essai!

    //Direct
<video id="videoThis" src="blahhh.mp4" onended="yourFunction()"></videoThis>

 -or-

//JavaScript (HTML5)
document.querySelector("#videoThis").addEventListener("ended",yourFunction,false);

 -or-

//jQuery
$("#videoThis").bind("ended",yourFunction);
    S'il vous plaît ne pas utiliser sur* attributs 🙁
    pouvez-vous élaborer/donner le lien, pourquoi pas?
    La séparation de la logique, vous ne devez jamais mélanger votre code HTML et JavaScript. "Ces attributs doivent être évités": developer.mozilla.org/en-US/docs/Web/Guide/HTML/...

    OriginalL'auteur SammyB