Maison >interface Web >js tutoriel >Comment contrôler les lecteurs YouTube Iframe préexistants avec JavaScript ?

Comment contrôler les lecteurs YouTube Iframe préexistants avec JavaScript ?

Linda Hamilton
Linda Hamiltonoriginal
2024-11-17 14:19:02255parcourir

How to Control Pre-existing Iframe YouTube Players with JavaScript?

Utiliser JavaScript pour contrôler les lecteurs YouTube Iframe préexistants

Défi :

Contrôler les lecteurs YouTube basés sur Iframe qui sont déjà présent dans le HTML utilisant le JavaScript API.

Solution :

La fonction callPlayer de Rob W permet de contrôler les vidéos YouTube encadrées. Voici comment cela fonctionne :

function callPlayer(frame_id, func, args) {
  var iframe = document.getElementById(frame_id);
  if (iframe && iframe.tagName.toUpperCase() != 'IFRAME') {
    iframe = iframe.getElementsByTagName('iframe')[0];
  }

  // Handle player readiness
  if (!iframe) {
    console.log('callPlayer: Frame not found;>

Utilisation :

Pour utiliser la fonction :

callPlayer("whateverID", function() {
  // Function runs when player is ready (like "onYouTubePlayerReady")
  callPlayer("whateverID", "playVideo");
});

Problèmes possibles et leurs solutions :

Q :Pourquoi la vidéo ne lit-elle pas démarrer la lecture vidéo ?
R : La lecture nécessite une interaction de l'utilisateur et la présence de allow="autoplay" dans l'URL iframe.

Q : Je' J'obtiens l'erreur "Une chaîne invalide ou illégale a été spécifiée".
A : L'API ne fonctionne pas correctement sur l'hôte local (fichier://). Hébergez votre page en ligne ou utilisez JSFiddle.

Q : Comment puis-je savoir quels arguments transmettre à la fonction callPlayer ?
A : Rob W a analysé le Source API pour déterminer les arguments nécessaires.

Q : Quels sont les navigateurs pris en charge ?
A : La fonction callPlayer fonctionne dans les navigateurs prenant en charge JSON et postMessage (IE 8 , Firefox 3.5 , Opera 10.50 , Safari 4 , Chrome 3 ).

Ressources supplémentaires :

  • YouTube officiel Référence de l'API Iframe : https://developers.google.com/youtube/iframe_api_reference
  • Réponse connexe : Fadein d'une vidéo encadrée à l'aide de jQuery
  • Prise en charge complète de l'API : écoute des événements YouTube dans jQuery

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