當Youtube視頻結束時隱藏iframe

Question

謝謝大家提前。 我需要一些幫助隱藏iframe的YouTube視頻時，可以有人指導我如何做到這一點？

<iframe id="promo_video" src="http://www.youtube.com/embed/XzZudNOwkU8" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" style="display:none;position:absolute;top:228px;left:492px;" height="527" width="934" frameborder="0"></iframe> 

我需要這樣的東西，但我無法找到如何使它

<script > 
function myFunction() 
{ 
    if (promo_video.end=positive) 
    reload anotherother page 


    } 


</script> 

Answer 1

希望這個解決方案會爲你工作。解決方案中唯一的變化是，您只需要來自iframe的視頻ID。請參考下面提到的小提琴鏈接。

<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', { 
      height: '390', 
      width: '640', 
      videoId: 'XzZudNOwkU8', <!-- video id should be here. last component from video URL --> 
      events: { 
      'onReady': onPlayerReady, 
      'onStateChange': onPlayerStateChange 
      } 
     }); 
    } 

    // autoplay video 
    function onPlayerReady(event) { 
     event.target.playVideo(); 
    } 

    // when video ends 
    function onPlayerStateChange(event) {   
     if(event.data === 0) {    
      $('#player').css('display', 'none'); 
     } 
    } 

</script> 

Fiddle link