更换视频后如何停止 (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

在隐藏 .video 之前，删除 iframe 中的 src。

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

Answer 2

将 &enablejsapi=1 添加到您的 iframe src 属性

例子

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

并致电

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

要停止iframe视频，可以使用"func":"pauseVideo"暂停视频

查看演示

JSFiddle : Demo

更换视频后如何停止 (Jquery)？

How can I stop a video when it is replaced (Jquery)?

methods

video

jquery

replacewith