비디오를 교체 할 때 어떻게 중지시킬 수 있습니까 (Jquery)?

Question

JQuery와 :

$(function() { 

$('.videos').hide(); 
$(".bat").click(function() { 
    $('.videos').hide(); 
    $('.morcego').slideDown(); 
    $('.default').replaceWith(".morcego"); 
}); 
$('.hit').click(function() { 
    $('.videos').hide(); 
    $('.careca').slideDown(); 
    $('.default').replaceWith(".careca"); 
}); 
$('.metro').click(function() { 
    $('.videos').hide(); 
    $('.metro-last').slideDown(); 
    $('.default').replaceWith(".metro-last"); 
    }); 
}); 

HTML :` 시계 듣고 우리의 리뷰

 <iframe width="900" height="400" src="https://www.youtube.com/embed/tl39XPeb7UE?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen class="videos morcego img-responsive"></iframe> 

     <iframe width="900" height="400" src="https://www.youtube.com/embed/g7uYfhWNvrA?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen class="videos careca img-responsive"></iframe> 

     <iframe width="900" height="400" src="https://www.youtube.com/embed/FDIjP6X9f98?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen class="videos metro-last img-responsive">></iframe> 

    </div> 

    <div class="videos-list-video"> 
     <h3 class="align-center">Popular Videos</h3> 
     <div class=img-list> 

      <img src="img/batman_videos.jpg" class="img-responsive bat"> 
     </div> 
     <div class=img-list> 

      <img src="img/hitman_videos.jpg" class="img-responsive hit"> 
     </div> 
     <div class=img-list> 

      <img src="img/metro_videos.png" class="img-responsive metro"> 
     </div> 


    </div> 

</div> 

이 프로그램은 잘 작동하지만 비디오를 교체 할 때, 다른 하나는 재생을 중지하지 않습니다 너는 그것을 듣는다. replaceWith() 메서드를 사용할 수 없다고 생각합니다. 제안 사항은 무엇입니까? 감사합니다.

Answer 1

당신은 비디오를 일시 정지 "func":"pauseVideo"를 사용할 수 iframe이 비디오를 중지

예

<iframe width="900" height="400" 
    src="https://www.youtube.com/embed/tl39XPeb7UE?rel=0&amp;showinfo=0&enablejsapi=1" 
    frameborder="0" allowfullscreen class="videos morcego img-responsive"></iframe> 

당신은 iframe의 src 속성에 &enablejsapi=1을 추가하고

jQuery("iframe")[0].contentWindow.postMessage('{"event":"command", 
"func":"stopVideo","args":""}', '*'); 

전화

,

확인 데모

JSFiddle는 : Demo

Answer 2

.video을 숨기기 전에 src을 iframe에서 제거하십시오.

$(this).find('.videos').attr('src', '');