Vimeo API：播放按钮和多个视频答案

【问题标题】：Vimeo API: Play button and multiple videosVimeo API：播放按钮和多个视频
【发布时间】：2011-09-04 07:24:45
【问题描述】：

我遇到了一些麻烦。我刚刚发现可以用js控制vimeo，现在我正在尝试创建一个播放按钮，它将开始播放vimeo视频。

我遇到的问题是我在同一页面上有多个视频。我拿了示例/playground 文件（来自这里 http://player.vimeo.com/playground / https://github.com/vimeo/player-api/tree/master/javascript）并删除了我不需要的功能，但是，我不明白如何将播放按钮与某个视频连接。

这是我目前所拥有的

HTML：

<iframe id="player_1" src="http://player.vimeo.com/video/7100569?api=1&amp;player_id=player_1" width="540" height="304" frameborder="0"></iframe>
<div class="intro">
     <span class="hide">Play 1</span>
</div>
<iframe id="player_2" src="http://player.vimeo.com/video/7100569?api=1&amp;player_id=player_2" width="540" height="304" frameborder="0"></iframe>
<div class="intro">
    <span class="hide">Play 2</span>
</div>

JS：

            var vimeoPlayers = document.querySelectorAll('iframe'),
                player;

            for (var i = 0, length = vimeoPlayers.length; i < length; i++) {
                player = vimeoPlayers[i];
                $f(player).addEvent('ready', ready);
            }


            function addEvent(element, eventName, callback) {
                if (element.addEventListener) {
                    element.addEventListener(eventName, callback, false);
                }
                else {
                    element.attachEvent(eventName, callback, false);
                }
            }


            function ready(player_id) {
                // Keep a reference to Froogaloop for this player
                var container = document.getElementById(player_id).parentNode.parentNode,
                    froogaloop = $f(player_id);

                function setupSimpleButtons() {
                    var buttons = container.querySelector('div.intro'),
                        playBtn = buttons.querySelector('.hide');

                    // Call play when play button clicked
                    addEvent(playBtn, 'click', function() {
                        froogaloop.api('play');
                    }, false);



                }

                setupSimpleButtons();
            }
        })();

如果我有不需要的代码，请帮我删除它。非常感谢。

【问题讨论】：

标签： javascript api playback vimeo

【解决方案1】：

您的ready() 函数在每个vimeo 播放器中调用一次。您需要更改与 addEvent 按钮连接的对象。为此，您可能需要将id 属性放在按钮本身上。

【讨论】：

【解决方案2】：

我想出了一个更容易做到这一点的方法，您可以在此处查看示例： http://labs.funkhausdesign.com/examples/vimeo/froogaloop2-api-basics.html

【讨论】：