Youtube iframe in Bootstrap Carousel - スライドショーでビデオを再生する

Question

私はページに複数のカルーセルを持ち、それぞれにビデオと画像が混在しています。ユーザーがカルーセルコントロール（左または右）のいずれかをクリックしてビデオを終了したときに、YouTube動画が再生されないようにしたいと思います。

私は、ユーザーがコントロールをクリックしたときに、再生中の現在のビデオに基づいてプレーヤーを作成し、そのビデオをオフにすることを検出できるようにしたいと考えています。私が見た他の例では、プレーヤーはonYoutubeIframeAPIReady関数で宣言されていましたが、ページ上のすべてのビデオに対してプレーヤーを動的に作成しないほうがよいと思いました。今、私はエラーを受けています

Uncaught TypeError: Object #<T> has no method 'stopVideo' 

私はカルーセルのコントロールをクリックします。ただし、Chromeのjavascriptコンソールで

player.stopVideo(); 

と入力すると正しく動作します。私は間違って何をしていますか？

<script> 
    var youtubeReady = false; 

    function onYouTubeIframeAPIReady(){ 
    youtubeReady = true; 
    } 

    $('.carousel').on('slide', function(){ 
    if(youtubeReady){ 
     console.log("setting player"); 
     var iframeID = $(this).find('.active').find('iframe').attr("id"); 
     player = new YT.Player(iframeID); 
     player.stopVideo(); 
    } 
    }); 
    </script> 

例カルーセル：

<div class="mainPhoto carousel slide 523" id="carousel-523"> 
      <div class="carousel-inner 523"> 
      <div class="item active"> 
      <div class="flex-video"> 
       <a class="fancybox" href="http://www.youtube.com/embed/4pEqbs0ISaw?version=3&amp;enablejsapi=1" rel="gallery 523" data-fancybox-type="iframe"> 
        <iframe src="http://www.youtube.com/embed/4pEqbs0ISaw?version=3&amp;enablejsapi=1" id="1188"> 
        </iframe> 
       </a> 
      </div> 
     </div> 
     <div class="item"> 
      <a class="fancybox" href="https://buildinprogress.s3.amazonaws.com/image/image_path/1189/2013-07-05_19.47.55.jpg" rel="gallery 523" data-fancybox-type="image"> 
       <img alt="Preview_2013-07-05_19.47.55" id="1189" src="https://buildinprogress.s3.amazonaws.com/image/image_path/1189/preview_2013-07-05_19.47.55.jpg" width="100%"> 
      </a> 
     </div> 
    </div> 
      <a class="carousel-control left" href="#carousel-523" data-slide="prev" style="display: none;">‹</a> 
      <a class="carousel-control right" href="#carousel-523" data-slide="next" style="display: none;">›</a> 
     </div> 

Answer 1

私はここにcallPlayer機能を使用して終了（すべてでユーチューブのAPIを使用する必要はありませんでした）：

YouTube iframe API: how do I control a iframe player that's already in the HTML?