Question

好吧，我被卡住了，即使在关注了Google的文档并在Stackoverflow上阅读建议后，我也不知道出了什么问题。为什么我不能在我的网页中控制Youtube嵌入？

如果我使用＆lt; body＆gt;创建HTML文件是：

<object id="o1" width="480" height="295">
  <param name="movie" 
    value="http://www.youtube.com/v/qCTLCNmnlKU&hl=en_US&fs=1&enablejsapi=1&">
  </param>
  <param name="allowFullScreen" value="true"></param>
  <param name="allowscriptaccess" value="always"></param>
  <embed id="e1" 
    src="http://www.youtube.com/v/qCTLCNmnlKU&hl=en_US&fs=1&enablejsapi=1&" 
    type="application/x-shockwave-flash" 
    allowscriptaccess="always" allowfullscreen="true" width="480" height="295">
  </embed>
</object>

即使我尝试这样做：

// I get an object. Yay.

document.getElementById('e1');

// This generates "...playVideo is not a function"

document.getElementById('e1').playVideo();

帮助！我究竟做错了什么？感谢。

Answer 1

好的，所以这是API页面上一小段文字的答案：http://code.google.com/apis/youtube/js_api_reference.html

“注意：要测试这些来电，您必须让自己的文件在网络服务器上运行，因为Flash播放器会限制本地文件与互联网之间的电话。”

因此，为了让我继续在Mac笔记本电脑上进行开发，我做了以下工作：

编辑我的 / etc / hosts 文件，将条目包含在我的localhost中：

127.0.0.1 testhost.com

编辑我的 /etc/apache2/httpd.conf 文件，添加指向我的开发目录的虚拟主机条目：

<VirtualHost *:80> ServerName testhost.com DocumentRoot /Users/amy/flashproj <Directory /Users/amy/flashproj> AllowOverride all Options MultiViews Indexes FollowSymLinks Allow from All </Directory> </VirtualHost>

重启Apache：

sudo apachectl restart

通过我的新虚拟服务器浏览回我自己的localhost：

http://testhost.com

瞧。这完全有效。我可以查询播放器的页面：

document.getElementById('e1'); // OK document.getElementById('e1').playVideo(); // OK!

呼！不需要 onYouTubePlayerReady（）！

Answer 2

Youtube播放器尚未在您尝试使用时加载。有一个特殊的回调函数，一旦加载就会自动触发。

显示的HTML页面无铬玩家必须实现一个回调函数命名 onYouTubePlayerReady。 API会播放器播放时调用此功能完全加载，API已准备就绪接听电话。

YouTube JavaScript Player API Reference。

因此，您可以通过以下方式重写代码：

<script type="text/javascript">
function onYouTubePlayerReady(playerId) {
    var ytplayer = document.getElementById('e1');
    ytplayer.playVideo();
}
</script>

如果有很多可以在playerapiid处理程序中区分的话，您也可以介意在嵌入播放器时传递onYouTubePlayerReady。

Answer 3

如果您使用ID“o1”而不是“e1”会怎样？

在这个页面上好了：http://code.google.com/apis/youtube/js_api_reference.html在我看来，需要包含“swfobject”库才能使该API可用。我会试试。

[编辑]好的，这就是我所拥有的：

<html>
  <head>
    <script src='http://code.jquery.com/jquery-1.4.1.js'></script>
    <script src='http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js'></script>
    <script>
      window['onYouTubePlayerReady'] = function onYouTubePlayerReady(playerId) {
        player = document.getElementById("zebra");
        player.playVideo();
      };
      $(function() {
         swfobject.embedSWF(
         "http://www.youtube.com/v/qCTLCNmnlKU?hl=en_US&fs=1&enablejsapi=1&playerapiid=ytplayer", 
          "foo",
          "480", "295",
          "8",
          null, null,
          { allowScriptAccess: 'always' },
          { id: 'zebra' }
        );
      });
    </script>
  </head>
  <body>
    <div id='foo'>Foo</div>
  </body>
</html>

这很有效，但奇怪的是，它仅在我从真实的Web服务器上提供时才有效。如果我把它放在本地文件中并在浏览器中加载它，它就不起作用。我不知道为什么，但我绝对不是Flash专家或YouTube专家。

请参阅http://gutfullofbeer.net/youtube.html（与上面输入的内容相同）

Answer 4

我在这个问题上坚持了两天..与youtube播放器变量相关的每个问题都与本地运行有关。通过windows / hosts伪造一个地址后，它可以很好地工作。

即使用document.getElementById（'xyz'）也无法控制Youtube嵌入.playVideo（） - 不是函数？

4 个答案: