Javascript 可以检测嵌入的 Youtube 视频何时结束？答案

【问题标题】：Can Javascript detect when an embedded Youtube video has ended?Javascript 可以检测嵌入的 Youtube 视频何时结束？
【发布时间】：2014-11-22 02:44:51
【问题描述】：

我有一个包含视频的 div。 div 的背景有一个假的“播放”按钮，我设计它用作播放按钮，而不是 Youtube 的标准视频“播放”按钮。视频最初设置为"display:none"。

我已经部署了下面的代码，以便当您单击 div 时，div 消失，视频现在显示并开始播放。

如何编辑代码，以便在视频播放完毕后，视频消失而 div 重新出现？

<div  class="videodiv" this.style.cursor='pointer'; 
onclick="thevid=document.getElementById('thevideo'); thevid.style.display='block'; 
this.style.display='none'; "></div>
<div  class="youtubevid" id="thevideo" style="display: none;"><object width="420" 
height="160"><param name="movie" value="//www.youtube.com/v/vIdeoUrl?
 hl=en_US&amp;version=3&amp;rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1">
</param><param name="allowFullScreen" value="true"></param><param 
name="allowscriptaccess" value="always">
</param><embed src="//www.youtube.com/v/vIdeoUrl?
hl=en_US&amp;version=3&amp;rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1" 
type="application/x-shockwave-flash" width="420" height="160" 
allowscriptaccess="always" allowfullscreen="true"></embed></object></div>

【问题讨论】：

标签： javascript video youtube dom-events

【解决方案1】：

这就是您要查找的内容：

http://jsfiddle.net/7Gznb/

// when video ends
    function onPlayerStateChange(event) {        
        if(event.data === 0) {            
            alert('done');
          //do something here

        }

顺便说一句，这是 Youtube API

【讨论】：

【解决方案2】：

看看API，好像有事件。

player.addEventListener('onStateChange', function(e) {
   if (e.data === 0) {
     // If state is 0 (ended), do something
   }
});

另外，附注：

您的 YouTube 视频似乎需要embed via JavaScript 才能参加活动。为此，

【讨论】：