Can't control Youtube embed even with document.getElementById('xyz').playVideo() - not a function?

后端未结

关注

 4  616

OK, I\'m stuck and I don\'t know what\'s wrong even after following Google\'s docs and reading suggestions here on Stackoverflow. Why can\'t I control Youtube embeds in my

相关标签:

4条回答

伪装坚强ぢ

2021-01-06 14:37

I was stuck with this problem for two days.. every problem related to youtube player variable was related to run it locally. After faking a address via windows/hosts it works perfectly.

0 讨论(0)
发布评论:

提交评论
- 加载中...
遇见更好的自我

2021-01-06 14:38
Youtube player hasn't yet been loaded at the time you're trying to use it. There is a special callback function that will be fired automatically as soon as it is loaded.

Your HTML pages that display the chromeless player must implement a callback function named onYouTubePlayerReady. The API will call this function when the player is fully loaded and the API is ready to receive calls.

by YouTube JavaScript Player API Reference.

Therefore you can rewrite your code in the following manner:
```
<script type="text/javascript">
function onYouTubePlayerReady(playerId) {
    var ytplayer = document.getElementById('e1');
    ytplayer.playVideo();
}
</script>
```
You can also mind passing playerapiid while embedding the player if there are plenty of them to distinguish in onYouTubePlayerReady handler.
0 讨论(0)
发布评论:

提交评论
- 加载中...

星月不相逢

2021-01-06 14:49

What happens if you use the id "o1" instead of "e1"?

OK well on this page: http://code.google.com/apis/youtube/js_api_reference.html it seems to me that the "swfobject" library needs to be included in order for that API to be available. I'll try it.

[edit] OK here's what I've got:

<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>

This works, but oddly enough it only works when I serve it from a real web server. If I put that in a local file and load it up in the browser, it doesn't work. I don't know why but then I'm absolutely not a Flash expert, or a YouTube expert.

See http://gutfullofbeer.net/youtube.html (same as what's typed in above)

0 讨论(0)

鱼传尺愫

2021-01-06 14:55
OK, so here's the answer found in one tiny line of text on the API page: http://code.google.com/apis/youtube/js_api_reference.html

"Note: To test any of these calls, you must have your file running on a webserver, as the Flash player restricts calls between local files and the internet."

So to allow me to continue to develop on my Mac laptop I did the following:
1. Edited my /etc/hosts file to include an entry back to my localhost:
```
127.0.0.1   testhost.com
```
2. Edited my /etc/apache2/httpd.conf file to add a virtual host entry pointing back to my development directory:
```
<VirtualHost *:80>
    ServerName testhost.com
    DocumentRoot /Users/amy/flashproj
    <Directory /Users/amy/flashproj>
        AllowOverride all
        Options MultiViews Indexes FollowSymLinks
        Allow from All
    </Directory>
</VirtualHost>
```
3. Restarted Apache:
```
sudo apachectl restart
```
4. Browsed back to my own localhost via my new virtual server:
```
http://testhost.com
```
Voila. That totally works now. I can query the page for the player:
```
document.getElementById('e1');                // OK
document.getElementById('e1').playVideo();    // OK!
```
Whew! No onYouTubePlayerReady() required either!
0 讨论(0)
发布评论:

提交评论
- 加载中...