2015-11-22 49 views
0

我在我的HTML頁面中嵌入了YouTube視頻。我試圖獲取YouTube視頻的當前時間。我用這個問題的答案來創建這樣的頁面 (YouTube currentTime with jQuery無法獲取youtube視頻當前時間

當我試圖顯示時間,我得到一個錯誤:'getCurrentTime不是一個函數'。

HTML

<div style="text-align:center"> 
    <button onclick="playPause()">Play</button> 
    <button onclick="showTime()">Show Time</button> 
    <br><br> 
    <iframe id = "it" width="560" height="315" src="https://www.youtube.com/v/FHtvDA0W34I?version=3&enablejsapi=1" frameborder="0" allowfullscreen></iframe> 
    <br> 
    <label id=startHighlighlbl>VideoHighlightStart: </label> 
</div> 

的JavaScript

<script> 
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('player', { 
     events: { 
      'onReady': onPlayerReady 
     } 
    }); 
} 

function onPlayerReady(event) { 
    event.target.playVideo(); 
} 


function ShowTime() { 

    alert(player.getCurrentTime()); 
} 


</script> 
+0

嘗試在'新YT.Player(改變'player' 'player''到新的'YT.Player(' it'' ...或在您的HTML –

+0

中將'id =「it」'更改爲'id =「player」'這裏是一支修改過的筆http://codepen.io/anon/pen/zvXmEp?editors=101 – Pellmellism

回答

-1

你應該通過YT-API加載你的視頻,因此player正確初始化,因此可通過API訪問。基本上你需要從你的HTML中刪除iframe,而讓YT-API爲你創建iframe。

嘗試以下操作:

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('it', { 
 
     height: '315', 
 
     width: '560', 
 
     videoId: 'FHtvDA0W34I', 
 
     events: { 
 
     'onReady': onPlayerReady, 
 
     'onStateChange': onPlayerStateChange 
 
     } 
 
    }); 
 
    } 
 

 
    function onPlayerReady(event) { 
 
    event.target.playVideo(); 
 
    } 
 

 
    var done = false; 
 

 
    function onPlayerStateChange(event) { 
 
    if (event.data == YT.PlayerState.PLAYING && !done) { 
 
     setTimeout(stopVideo, 6000); 
 
     done = true; 
 
    } 
 
    } 
 

 
    function stopVideo() { 
 
    player.stopVideo(); 
 
    } 
 

 
    function ShowTime() { 
 
    alert(player.getCurrentTime()); 
 
    }
<body> 
 
    <button onclick="ShowTime()">Show Time</button> 
 
    <br> 
 
    <div id="it"></div> 
 
</body

+0

'基本上你需要從**中刪除你的iframe,這不是問題** **問題是'代碼中的'