2011-07-28 24 views
3

我試圖抓住一個YouTube的iframe的事件: http://lab.joergpfeiffer.de/videofull/youtube.phpYouTube的iframe的事件

所以我首先撥打了API

<script type='text/javascript' src='http://www.youtube.com/player_api'></script> 

我設置了iframe

<iframe id="ytfullplayer" type="text/html" width="640" height="390" src="http://www.youtube.com/p/B93C3D017CB2D65A?enablejsapi=1&origin=lab.domain.de" frameborder="0" ></iframe> 

,並嘗試稍後設置事件

var ytfullplayer; 
    function onYouTubePlayerAPIReady() { 
     console.log('onYouTubePlayerAPIReady'); 
     ytfullplayer = new YT.Player('ytfullplayer', { 
      events: { 
       'onReady': testfunc, 
       'onPlaybackQualityChange': testfunc, 
       'onStateChange': testfunc, 
       'onError': testfunc 
      } 
     }); 

    } 
    function testfunc(){ alert('hello'); } 

無論我做什麼,都不會發生任何事件。我讀了10次iframe api。它應該實際工作。

有什麼想法?

回答

6

執行()onYouTubePlayerAPIReady之前這些程序

// This code loads the IFrame Player API code asynchronously. 
var tag = document.createElement('script'); 
tag.src = "http://www.youtube.com/player_api"; 
var firstScriptTag = document.getElementsByTagName('script')[0]; 
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

如果還是老樣子有困惑然後訪問http://code.google.com/apis/youtube/iframe_api_reference.html

+2

我有同樣的問題,這一個固定它。 – mimrock

0

阿迪爾的答案應該解決您的問題。

Google建議您異步加載播放器API腳本,即讓腳本同時加載時加載頁面的其餘部分。

由於您在早期將標記放置在標記中,所以在該腳本加載之前,不會執行頁面的其餘部分。因此,當對onYouTubePlayerAPIReady()進行調用時,您的函數尚未定義。

0

我有同樣的問題。它似乎涉及到手動放置iframe而不是使用div標籤替換。如果我使用div方法,它工作正常,手動iframe,沒有。

API腳本的異步加載,或手動將它包含在頭中沒有任何區別。

我剛剛去了現在的div替代,並停止了與之戰鬥。

2

我做了以下。

入門在https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player

發現示例代碼然後我取代:

<div id="player"></div> 

<iframe id="player" type="text/html" width="640" height="390" 
    src="http://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1&origin=http://example.com" 
    frameborder="0"> 
</iframe> 

(iframe中標記在同一URL找到)

然後我擺脫了上述的原始參數 - 這似乎使噸手勢工作。順便說一句,我發現第2步可以用標記替換:

<script src="https://www.youtube.com/iframe_api"></script> 
+0

完整的示例代碼? –

+0

步驟2中的原始腳本旨在異步加載frame_api。 如果使用