"Ytplayer ist nicht definiert" bei der Verwendung der SWFObject-Methode, um ein chromloses Youtube-Video auf einer Website einzubinden

Question

Der Code ist wie folgt, aber ich bekomme einen "ytplayer is not defined" -Fehler. Ist das ein Problem mit

<script src="http://www.google.com/jsapi"></script> 
<script> 
    google.load("swfobject", "2.1"); 
</script> 

<script type="text/javascript"> 

     function updateHTML(elmId, value) { 
      document.getElementById(elmId).innerHTML = value; 
     } 

     function setytplayerState(newState) { 
      updateHTML("playerstate", newState); 
     } 

     function onYouTubePlayerReady(playerId) { 
      ytplayer = document.getElementById("myytplayer"); 
      ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
      ytplayer.addEventListener("onError", "onPlayerError"); 
     } 

     function onytplayerStateChange(newState) { 
      setytplayerState(newState); 
     } 

     function onPlayerError(errorCode) { 
      alert("An error occured: " + errorCode); 
     } 

     // functions for the api calls 
     function loadNewVideo(id, startSeconds) { 
      if (ytplayer) { 
      ytplayer.loadVideoById(id, parseInt(startSeconds)); 
      } 
     } 

     function play() { 
      if (ytplayer) { 
      ytplayer.playVideo(); 
      } 
     } 


    </script> 

und seine hier eingefügt

<div id="ytapiplayer"> 

</div> 
<script type="text/javascript"> 
     // <![CDATA[ 

     // allowScriptAccess must be set to allow the Javascript from one 
     // domain to access the swf on the youtube domain 
     var params = { allowScriptAccess: "always", wmode: "transparent", menu: "false" }; 
     // this sets the id of the object or embed tag to 'myytplayer'. 
     // You then use this id to access the swf and make calls to the player's API 
     var atts = { id: "myytplayer" }; 
     swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer", 
         "ytapiplayer", "100%", "100%", "8", null, null, params, atts); 
     loadNewVideo('11mrMppgfrQ','0'); 
     play(); 
//]]> 
    </script> 

onYouTubePlayerReady Werke und alert(ytplayer); in dieser Funktion ein Objekt zurückgibt, jedoch ruft alert(ytplayer); innerhalb loadNewVideo null zurückgibt.

Dies wird direkt von http://code.google.com/apis/youtube/chromeless_example_1.html kopiert, wo es gut funktioniert. Irgendwelche Ideen, wo ich falsch liege? Geht es darum, getElementById für ein Objekt aufzurufen?

Answer 1

Das Problem gefunden.

loadNewVideo('11mrMppgfrQ','0'); 
     play(); 

forderten vor

function onYouTubePlayerReady(playerId) { 
     ytplayer = document.getElementById("myytplayer"); 
     ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
     ytplayer.addEventListener("onError", "onPlayerError"); 
    } 

sie in der Funktion nach dieser Zeile

ytplayer = document.getElementById("myytplayer"); 

Umzug das Problem behoben

endgültige Code wie folgt aussieht:

function onYouTubePlayerReady(playerId) { 
    ytplayer = document.getElementById("myytplayer"); 
    ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
    ytplayer.addEventListener("onError", "onPlayerError"); 
    loadNewVideo('11mrMppgfrQ','0'); 
    play(); 
}