Maison >interface Web >tutoriel CSS >Comment puis-je lire et mettre en pause des vidéos HTML5 à l'aide de jQuery dans une interface à onglets ?

Comment puis-je lire et mettre en pause des vidéos HTML5 à l'aide de jQuery dans une interface à onglets ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-12-08 16:54:12888parcourir

How Can I Play and Pause HTML5 Videos Using jQuery in a Tabbed Interface?

Lecture et mise en pause de vidéos HTML5 avec jQuery

Dans ce scénario, vous souhaitez contrôler les vidéos HTML5 dans une interface à onglets à l'aide de jQuery. L'objectif est de lire une vidéo lorsque l'on clique sur son onglet associé et de la mettre en pause lorsqu'un autre onglet est activé.

La solution jQuery

Pour lancer la lecture vidéo, vous utilisez le code jQuery suivant :

$('#playMovie1').click(function() {
  $('#movie1').play();
});

Cependant, le problème survient en raison de l'utilisation de la fonction « play ». Contrairement aux fonctions jQuery, « play » est une méthode native du DOM. Par conséquent, vous devez cibler l'élément DOM pour l'exécuter efficacement.

L'équivalent jQuery de l'accès à l'élément DOM natif est « get ». En l'intégrant dans votre code, vous pouvez obtenir le comportement de lecture souhaité :

$('#videoId').get(0).play();

Explication

La méthode 'get' récupère l'élément DOM natif de la sélection jQuery . En combinant cela avec la fonction « lecture », vous pouvez contrôler directement la lecture vidéo à l'aide de jQuery, garantissant ainsi une expérience transparente dans votre interface à onglets.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn