当 youtube 视频开始播放时，有什么方法可以用 javascript 检测吗? [英] Is there any way to detect with javascript when a youtube video starts playing?
问题描述
对于嵌入的 youtube iframe 是否有视频的加载"?
Is there an "onload" of the video for an embeded youtube iframe?
我想在我选择的音乐视频开始后才开始我的脚本.
I'd like to start my script only after the music video i have selected starts.
我已将 onload 事件粘贴到传送 youtube 视频的 iframe 上，但这与实际视频的加载(缓冲已完成准备播放)不符.它仅对应于视频播放器已加载到页面中的时间.
I have stuck an onload event onto the iframe the youtube video is delivered in, but that does not correspond to the loading (buffering has finished ready to play) of the actual video. It only corresponds to when the video player has been loaded in the page.
换句话说，有没有办法在 youtube 视频开始播放时使用 javascript 进行检测?
In other words, is there any way to detect with javascript when a youtube video starts playing?
推荐答案
您要找的一切都可以在 Youtube Iframe API 参考.
Everything you're looking for can be found in the Youtube Iframe API reference.
我也会在这里粘贴相关代码，但请注意，我只修改了一行以触发 onReady 警报.其余代码来自上述参考页面.
I'll paste the relevant code here as well, but be aware that I only modified one line to trigger an alert onReady. The rest of the code comes from the aforementioned reference page.
<!DOCTYPE html>
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player"></div>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: 'M7lc1UVf-VE',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
alert("Video Ready!");
event.target.playVideo(); // You can omit this to prevent the video starting as soon as it loads.
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
</script>
</body>
</html>
这篇关于当 youtube 视频开始播放时，有什么方法可以用 javascript 检测吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
