クリック時にYouTube動画を一時停止する方法がわからない

Question

私のユーザーは、iframeの代わりにYouTubeが提供するタグを利用する古い埋め込み方法を使用しています。ユーザーが次のスライドをクリックしたときにビデオを一時停止できるように、プレイヤーの状態（一時停止、再生など）を検出する方法を把握しようとしています。

現在Wordpressを使用していますが、YouTubeの埋め込みコードを貼り付けることができるメタボックスがあり、そのコードブロックをスライダに出力します。私は自分のlocalhostで作業しています（例：http://mysite.dev）。何かを知ることは、潜在的にユーザが複数のビデオをスライダ上に持つことができることである。

私の人生の間、私はYouTube APIを実行することができません。

1）これは、このビデオは、私がdiv要素で作られたスライダーである）、彼らはボックス

<object width="475" height="271"> 
    <param name="movie" value="http://www.youtube.com/v/soefG7iisoE?wmode=opaque&version=3&enablejsapi=1&modestbranding=1&autohide=1&rel=0&hl=en_US"></param> 
    <param name="allowFullScreen" value="true"></param> 
    <param name="allowscriptaccess" value="always"></param> 
    <embed src="http://www.youtube.com/v/soefG7iisoE?wmode=opaque&version=3&enablejsapi=1&modestbranding=1&autohide=1&rel=0&hl=en_US" type="application/x-shockwave-flash" width="475" height="271" allowscriptaccess="always" allowfullscreen="true"></embed> 
</object> 

2に貼り付けるユーチューブの埋め込みオブジェクトである：私は

<div class="videoContainer"> 
    [there youtube embed code outputs here - see point 1] 
</div> 

JQueryを使用して、私はAPIをこのように呼び出そうとしました：

function onYouTubePlayerReady(playerId) { 
    // using the class and the tag as selector because there could be 
    // multiple videos *and* the user might not put an ID in the object tag 
    ytplayer = $('.videoContainer object'); 
    ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
} 

function onytplayerStateChange(newState) { 
    alert("Player's new state: " + newState); 
} 

私はstopCycleという関数をjQueryドキュメント）.ready（function（$）{}）;コードブロックであり、ユーザーが次のスライドをクリックしたときに呼び出す必要があるのはこの関数です。だからここ

は私の質問です：

1. 私は、任意の外部のJavaScriptファイルを呼び出す必要がありますか？
2. JQueryドキュメントのレディブロック内で、YouTube APIを呼び出して、動画が再生されているかどうかを確認できますか？
3. 私のコードで見逃していることが他にもありますか、見たいものがありますか？

YouTube URLのみを入力してから、JQuery SWFObjectを使用してビデオを出力する方がよいかどうか疑問に思っています。どのようにすればよいかわからないのは、各スライドのビデオをループアウトすることです（合計5つ）。だから、もし彼らがどのように私はそれを行うだろう各スライダーのビデオを持っていた？

私は知っている...完全にここに質問が満載です。私はあなたがエラーを持って表示されるものと

Answer 1

：

ytplayer = $('.videoContainer object'); 
//should be 
ytplayer = document.getElementById("myytplayer");

次に、あなたは、APIのいずれかがhereを呼び出し、すべてが結構な

あなたがjQueryのを使用できない理由を動作する必要があります使用することができますこのためのセレクタは、<embed>要素が必要であるためです。 jQueryが返すものは、セレクタに一致するすべての要素の配列です。以前

4言ったように、現在のビデオytplayer .getVideoUrl()

3）を取得するには）外部ファイル

2であなたのjsを持っていない限り、

• 1）：
  は、あなたの質問に答えるために/ 5）これを使用してプレイリストを設定できます：ytplayer .cuePlaylist

Answer 2

YouTube APIを使用している場合は、

var ytplayer = document.getElementById("myytplayer"); 
pauseVideo = function(){ 
    if (ytplayer){ 
     ytplayer.pauseVideo(); 
    } 
} 

<a href="javascript:void(0);" onclick="pauseVideo();">Pause</a> 

詳細はこちらをご覧ください：
http://code.google.com/apis/youtube/js_api_reference.html#Playback_controls

EDIT

埋め込まれたプレイヤーがIDを持っていない場合、あなたはこのような何かを試すことができ、このようなビデオを一時停止することができ、LD ：

function onYouTubePlayerReady(playerId) { 
    $("#" + playerId)[0].addEventListener('onStateChange', "(function(state) { return playerState(state, '" + playerId + "'); })"); 
} 

function playerState(state, playerId) { 
    console.log(state); 
    console.log(playerId); 
}