Я работаю над сайтом, на котором есть множество встроенных видеороликов YouTube, клиент хочет показывать всплывающее окно, когда видео перестает отображаться.
Я посмотрел на youtube api и, похоже, есть способ определить, когда заканчивается видео:
http://code.google.com/apis/youtube/js_api_reference.html
но я не могу встроить видео, как они упоминались на этой странице, поскольку все видео уже есть на сайте (тысячи добавлены вручную путем вставки кода для встраивания).
Есть ли способ определить окончание этих видео, не изменяя ни одно из существующих видео (с помощью javascript)?
enablejsapi=1
. Если они находятся в базе данных, изменитьsrc
атрибут будет довольно просто . Вам может понадобиться регулярное выражение, если они статически вставлены в файлы HTML.Ответы:
Это можно сделать через API плеера YouTube:
http://jsfiddle.net/7Gznb/
Рабочий пример:
<div id="player"></div> <script src="http://www.youtube.com/player_api"></script> <script> // create youtube player var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width: '640', height: '390', videoId: '0Bmhjf0rKe8', events: { onReady: onPlayerReady, onStateChange: onPlayerStateChange } }); } // autoplay video function onPlayerReady(event) { event.target.playVideo(); } // when video ends function onPlayerStateChange(event) { if(event.data === 0) { alert('done'); } } </script>
источник
Что вы можете сделать, так это включить скрипт на все страницы, который выполняет следующие действия ... 1. Найдите youtube-iframe: ищите его по ширине и высоте по заголовку или находя www.youtube.com в его источнике. Вы можете сделать это ... - пройдя через window.frames цикл for-in, а затем отфильтровать по свойствам
вставить jscript в iframe текущей страницы, добавив обязательную функцию onYoutubePlayerReady http://shazwazza.com/post/Injecting-JavaScript-into-other-frames.aspx
Добавьте слушателей событий и т. Д.
Надеюсь это поможет
источник