Question

我有一個包含視頻的div。 div的背景設有一個假的「播放」按鈕，我將其設計爲播放按鈕，而不是Youtube的標準視頻「播放」按鈕。視頻最初設置爲「顯示：無」。

我已經部署了下面的代碼，以便當你點擊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> 

Answer 1

這裏就是你要找的內容：

http://jsfiddle.net/7Gznb/

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

     } 

由這樣

Answer 2

拿在API一看是Youtube的API，似乎還有事件。

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

• API provided by Google.
• Events API
• Embedding via JavaScript

此外，在邊注：

它看起來像您的YouTube視頻必須embed via JavaScript事件。爲此，