2012-04-03 8 views
0

私はYTオブジェクトをキャプチャしようとしています。 onYouTubePlayerReady()関数が呼び出されましたが、オブジェクトで何もできないようです。Youtube JSAPI、動作しない例

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("swfobject", "2.2"); 
</script> 
<script type="text/javascript"> 
    function onYouTubePlayerReady (playerID) 
    { 
     ytplayer = document.getElementById(playerID); 
    } 

    function play() 
    { 
     if (ytplayer) 
     { 
      ytplayer.playVideo(); 
     } 
    } 
    play(); 
</script> 

YTPlayerをは(そのための捕捉されない例外TypeErrorプレーDOMはなく、ビデオ自体に参照されている:オブジェクト#は何のメソッド「playVideo」を持っていませんが、これは基本的にGoogleが与えられた例である

を。私は間違って何をしていますか?

答えて

0

上記のコードでビデオプレーヤーをどこに初期化しているのかわかりません。下記のコードはFirefoxで正常に動作しています。 [YOUR_VIDEO_ID]の代わりにプレイしてください。あなたはすべて設定する必要があります。以下のコードは、IEとChromeのチャンピオンのように機能します。

<div id="video" class="overlay"> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
    <div id="ytapiplayer"></div> 
    <script type="text/javascript"> 
    var params = { allowScriptAccess: "always" }; 
    var atts = { id: 'myytplayer' }; 
    swfobject.embedSWF("http://www.youtube.com/v/[YOUR_VIDEO_ID]?enablejsapi=1&playerapiid=ytplayer&version=3", "ytapiplayer", "640", "360", "8", null, null, params, atts); 

    function onYouTubePlayerReady(playerId) { 
     ytplayer = document.getElementById("myytplayer"); 

     ytplayer.addEventListener('onStateChange','onytplayerStateChange'); 
    } 

    function onytplayerStateChange(newState) { 
     alert("Player's new state: "+newState); 
    } 

    function play() { 
     if (ytplayer) { 
     ytplayer.playVideo(); 
     } 
    } 
    </script> 
    <a href="javascript:void(0)" onclick="play()">Play</a> 
</div> 

は、私は何が欠けていることは、あなたがオブジェクトの初期化属性(VARのATTS = ...)ラインに渡されたものは何でもにより「playerId」を参照する必要があることだと思います。少しのテストを行うことで、 "onYouTubePlayerReady"関数が実際にDOMルックアップの実行に使用できる有効なID値を渡すことはないことがわかります。

1

ページが読み込まれるとすぐにplay();に電話しています。

しかし、youtube playerを読み込むには時間がかかりますので、しばらくしてからonYouTubePlayerReady関数が呼び出されます。

onYouTubePlayerReadyytplayerを定義するため、onYouTubePlayerReadyが呼び出される前にytplayerを使用することはできません。また、ytplayerをグローバルにして、両方の関数で使用できるようにする必要があります。

関連する問題