upptäcka om Youtube video är spelat(Javascript, JQuery)

Permalänk

upptäcka om Youtube video är spelat(Javascript, JQuery)

Hej
Jag är en elev som läser informationsteknik som går TE4 kurs
Som egen projekt tänkte jag att skapa en youtube jquery plugin.
När man skrollar ner, användare ska se youtube video längst ner i fönstret.
För att min plugin ska fungera, webbläsaren först måste upptäcka om youtube video är spelat så man kunde titta det video som man vill.

Den är min kod som jag använder

<html> <head> </head> <body> <iframe id="youtube" class="fixableVideo" width="854" height="480" src="https://www.youtube.com/embed/9bZkp7q19f0?enablejsapi=1" frameborder="0" allow="encrypted-media" allowfullscreen></iframe> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min..."></script> <script src= "https://www.youtube.com/iframe_api"></script> <script src="fixYoutubeBottom.js"></script> </body> </html>

//fixYoutubeBottom.js var player; function onYouTubePlayerAPIReady() { player = new YT.Player('fixableVideo', { events: { 'onStateChange': function(event) { if (event.data == YT.PlayerState.PLAYING) { alert('no'); } } } }); }

problemet är API kräver id-värde som första parametern i YT.Player()
men id kan inte vara duplicerad och jag vill upptäcka alla youtube video oavsett hur mycket det finns i sidan.
Därför jag bestämde använda class istället id men alert metoden fungerar inte.
Om jag bytar fixableVideo till youtube, alert fungerar.

Någon idé ? Jag tycker youtube API tillåter inte att ha något annat istället id.

Permalänk
Medlem
Skrivet av oehqoehfo:

Hej
Jag är en elev som läser informationsteknik som går TE4 kurs
Som egen projekt tänkte jag att skapa en youtube jquery plugin.
När man skrollar ner, användare ska se youtube video längst ner i fönstret.
För att min plugin ska fungera, webbläsaren först måste upptäcka om youtube video är spelat så man kunde titta det video som man vill.

Den är min kod som jag använder

<html> <head> </head> <body> <iframe id="youtube" class="fixableVideo" width="854" height="480" src="https://www.youtube.com/embed/9bZkp7q19f0?enablejsapi=1" frameborder="0" allow="encrypted-media" allowfullscreen></iframe> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min..."></script> <script src= "https://www.youtube.com/iframe_api"></script> <script src="fixYoutubeBottom.js"></script> </body> </html>

//fixYoutubeBottom.js var player; function onYouTubePlayerAPIReady() { player = new YT.Player('fixableVideo', { events: { 'onStateChange': function(event) { if (event.data == YT.PlayerState.PLAYING) { alert('no'); } } } }); }

problemet är API kräver id-värde som första parametern i YT.Player()
men id kan inte vara duplicerad och jag vill upptäcka alla youtube video oavsett hur mycket det finns i sidan.
Därför jag bestämde använda class istället id men alert metoden fungerar inte.
Om jag bytar fixableVideo till youtube, alert fungerar.

Någon idé ? Jag tycker youtube API tillåter inte att ha något annat istället id.

Är fixableVideo klassen?
Jag har inte kollat detta djupare men på rak arm känns det som player objektet representerar just _en_ spelare.
Om den inte kan representera flera så får du skapa en array av spelare där varje objekt representerar en spelare som initierats av ID't.

Visa signatur

Arch - Makepkg, not war -||- Gigabyte X570 Aorus Master -||- GSkill 64GiB DDR4 14-14-15-35-1T 3600Mhz -||- AMD 5900x-||- Gigabyte RX6900XT -||- 2x Adata XPG sx8200 Pro 1TB -||- EVGA G2 750W -||- Corsair 570x -||- O2+ODAC-||- Sennheiser HD-650 -|| Boycott EA,2K,Activision,Ubisoft,WB,EGS
Arch Linux, one hell of a distribution.