Bootstrap Carousel'de YouTube iframe - slayttaki videoyu durdur

Question

Her sayfada bir dizi video ve resimle birlikte bir sürü Atlıkarınca var. Kullanıcı, bir videodan çıkış yaptıktan sonra, dönüşüm sonuçlarından birini (sol veya sağ) tıklatarak YouTube videolarının oynatılmasını durdurmak istiyorum.

Kullanıcının denetimleri ne zaman tıklattığını, çalmakta olan geçerli videoya göre bir oynatıcı oluşturduğunu ve bu videoyu kapattığını algılamak istiyorum. Gördüğüm diğer örneklerde, oyuncularYoutubeIframeAPIReady işlevinde bildirildi, ancak sayfadaki her video için dinamik olarak oynatmalarının daha iyi olacağını düşündüm. Şu anda, karusel denetimlerini tıklattığımda

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

hatalarını alıyorum. Ancak, ben, iyi çalışıyor javascript konsolu Chrome'da

player.stopVideo(); 

yazarsanız. Neyi yanlış yapıyorum?

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

Örnek atlıkarınca:

<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

Ben (hiç youtube API kullanarak gerektirmeyen olan) burada callPlayer işlevini kullanarak sona erdi:

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