7

OK、私は完全に立ち往生しています。誰かがVimeoのFroogaloopAPIを使ってVimeoビデオをロードした経験があることを本当に望んでいます。

「準備完了」イベントをキャッチできないようです。

Froogaloop：

<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>

私のスクリプト：

$.getJSON('http://www.vimeo.com/api/oembed.json?url=' + encodeURIComponent('http://vimeo.com/27027307') + '&width=300&callback=?', function(data){
    $('#video-container').html(data.html); //puts an iframe embed from vimeo's json
    $('#video-container iframe').ready(function(){
        player = document.querySelectorAll('iframe')[0];
        $f(player).addEvent('ready', function(id){
            console.log('success');
        });

    });
});

ビデオは正常にロードされます。これは私がコンソールに表示しているメッセージです：

Uncaught TypeError: Cannot read property 'ready' of undefined

一時停止などを検出するためにイベントリスナーを使用する必要があります。この投稿を見ましたが、残念ながら、主な違いは、JSONを介して動的にロードしていることです。また、VimeoにはFroogaloopの動作例がありますが、jQueryでは動作していません。

前もって感謝します！！！

4

3 に答える 3

23

編集（2014年8月）：最近、jQuery Vimeoプラグインを作成しました。これは、基本的にこの問題をはるかにエレガントに解決します。しかし、解決策は、ハードコーディングしている場合、これは以下のとおりです。

Vimeoビデオをロードするときは&api=1、URLにクエリ文字列を含める必要があります。これにより、APIイベント呼び出しを行うことができます。Vimeoでは、&player_id=SOME_ID複数の動画を読み込む場合にも必要です。これは、読み込まれるiframeのIDと一致する必要があります（または、私の場合、JSONが読み込まれた後、jQueryを使用してiframeに追加します。動的に。）

私はこれで半日を失った。Vimeoビデオを動的にロードしようとしている他の人に役立つ場合、私の最終的なコードは次のようになります。

VimeoのFroogaloopフレームワークを使用する

<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>

私のjs

var videoData = [
{
    'title':'The Farm',
    'id':'farmvideo',
    'videoURL':'http://vimeo.com/27027307'
}];

$.getJSON('http://www.vimeo.com/api/oembed.json?url=' + encodeURIComponent(videoData[0]['videoURL']) + '&api=1&player_id='+ videoData[0]['id'] +'&width=300&callback=?', function(data){
    $('#video-container').html(data.html); //puts an iframe embed from vimeo's json
    $('#video-container iframe').load(function(){
        player = document.querySelectorAll('iframe')[0];
        $('#video-container iframe').attr('id', videoData[0]['id']);
        $f(player).addEvent('ready', function(id){
            var vimeoVideo = $f(id);
            console.log('success');
        });
    });
});
于 2011-08-04T21:26:52.997 に答える
9

loadiframeのreadyイベントの代わりにイベントを使用してみてください。

3行目は次のようになります。

$('#video-container iframe').load(function(){
于 2011-08-03T23:56:12.240 に答える
4

私はあなたの例を「フォーク」し、froogaloopapiを使用して複数のビデオでvimeoを再生/一時停止することを示すバージョンを作成しました。したがって、1つのビデオを開始すると、他のすべてのビデオの再生が停止します：http: //jsfiddle.net/nerdess/D5fD4/3/

于 2012-07-24T22:42:12.880 に答える