Problème avec l'api youtube et jQuery

Par lakamark, il y a 11 ans

Javascript

Bonjour,
Je développe mon portfolio je veux personnaliser le lecteur de Youtube.

$app = $('#app'); $app.on('click','#btn_player',function(event){ $this = $(this); $yt_id = $this.data('ytid'); onYouTubeIframeAPIReady($yt_id); });

Il lance cette fonction :

function onYouTubeIframeAPIReady(video_id){ // Charger api Youtube (javascript) var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag,firstScriptTag); var player; player = new YT.Player('player',{ height : '720', width : '960', videoId : video_id', showinfo : 0, rel : 1, events : { onReady : onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); }

Le problème est que mon paramètre "video_id" est perdu lors de l'initisialisation de l'objet Youtube

Le deuxième problème est que j'ai une erreur de ce type : Uncaught ReferenceError: YT is not defined

Merci de votre aide.

4 réponses

betaWeb, il y a 11 ans

Salut salut,

Alors je ne sais pas si ça vient de ton copier/coller ici ou pas, mais tu as une quote qui traine et qui bloque le script juste après "video_id":

function onYouTubeIframeAPIReady(video_id){ // Charger api Youtube (javascript) var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag,firstScriptTag); var player; player = new YT.Player('player',{ height : '720', width : '960', videoId : video_id, showinfo : 0, rel : 1, events : { onReady : onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); }

Après je me rappelle avoir eu un soucis similaire au tien, mais j'avais abandonné faute de temps.
Que te donne la console JS de l'inspecteur ?

lakamark, il y a 11 ans

J'ai modifier ma fonction :

function onYouTubeIframeAPIReady(video_id){ var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag,firstScriptTag); var player; player = new YT.Player('player',{ height : '720', width : '960', videoId : video_id, showinfo : 0, rel : 0, events : { onReady : onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); }

J'ai cette erreur dans ma console js : Uncaught ReferenceError: YT is not defined

betaWeb, il y a 11 ans

Oui beh j'avais un truc similaire.

Vérifies dans le code source de la page que les scripts YT (les balises <script>) sont bien intégrés.

Tu utilises bien une iframe pour le player (l'API) ?

lakamark, il y a 11 ans

Je te comprend pas.