检测YouTube视频结束时 - javascript - 不起作用

Question

我有db中的youtube视频（只有他们的url）。他们以这种形式：

http://www.youtube.com/embed/CT1909pdGBU

现在，我想，当检测到影片结束，看样东西来代替视频容器的人。

我尝试下列步骤操作：

1. changed the above youtube url to: 

http://www.youtube.com/embed/CT1909pdGBU?version=3&enablejsapi=1

2. added this js code in videopage.html 

    var player; 
    function onYouTubePlayerAPIReady() { 
     alert('api ready!'); 
     player = new YT.Player('player', { 
      events: { 
      'onStateChange': onPlayerStateChange 
      } 
     }); 
    } 
    // when video ends 
    function onPlayerStateChange(event) { 
     if(event.data === 0) { 
      alert('done'); 
     } 
    } 

但我越来越没有"api ready!"也不"done"警报..我究竟做错了什么？

Answer 1

很简单：

var tag = document.createElement('script'); 
    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    var player; 
    function onYouTubeIframeAPIReady() { 
     player = new YT.Player('myyoutubevideo_iframe_div', { 
      height: '410', 
      width: '100%', 
      videoId: '{{ video.yt_id }}', 
      events: { 
       'onReady': onPlayerReady, 
       'onStateChange': onPlayerStateChange 
      } 
     }); 
    } 
    function onPlayerReady(event) { 
     event.target.playVideo(); 
    } 
    var done = false; 
    function onPlayerStateChange(event) { 
     if (event.data == YT.PlayerState.ENDED) { 
      $('#myyoutubevideo_iframe_div').hide(); 
      $('#aftervideo_div').show(); 
     } 
    }