2012-04-03 30 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> 

YouTube播放器被引用到DOM,而不是视频本身(打为此抛出遗漏的类型错误:对象#有没有一种方法“的playVideo”,但是这基本上是由谷歌给出的例子

我在做什么错了?

回答

0

我在上面的代码中看不到你在什么地方初始化你的视频播放器,下面的代码在Firefox中工作正常,用你想要的视频代替视频ID请在下方播放[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> 

我想你错过的是,你需要引用“playerId”通过任何你传递到对象的初始化属性(VAR的ATT = ...)线。做一点测试确实显示“onYouTubePlayerReady”函数并没有实际传递一个可用于执行DOM查找的有效id值。

1

只要页面加载,即打电话给play();

但是,加载youtube播放器需要一些时间,因此在一段时间后函数onYouTubePlayerReady会被调用。

因为您在onYouTubePlayerReady中定义了ytplayer,所以在调用onYouTubePlayerReady之前不能使用ytplayer。此外,ytplayer应该是全球化的,这样两个功能都可以使用它。