jquery - 如何在模态窗口中停止YouTube视频？

Question

我的html中有以下代码:

<div class="modal-pop modal-pop1">
    <div class="modal_bg"></div>
    <div class="modal_container wrap">
        <div class="wrap_modal_container">
            <img src="img/modal_button_exit.png" alt="" class="modal_button">
            <div class="vid">
                <iframe width="100%" height="437" src="//www.youtube.com/embed/c_LxX0Sbq2k?rel=0" frameborder="0" allowfullscreen></iframe>
            </div>
        </div>
    </div>
</div>

这整个块设置为 display: none然后我用jQuery显示

$('.listen-example').click(function(){ 
    $('.modal-pop1').fadeIn()
})

和此代码以关闭模式窗口

$('.modal_bg, .modal_button').click(function() {
        $('.modal-pop').fadeOut();
});

它可以正常工作，但是在关闭模式窗口后，youtube视频仍然可以继续播放，我该如何解决？

Answer 1

给iframe一个唯一ID 说'myid'并尝试以下代码:-

$('.listen-example').click(function(){ 
    $('.modal-pop1').fadeIn();
    $("#myid").attr('src','//www.youtube.com/embed/c_LxX0Sbq2k?rel=0');
});

$('.modal_bg, .modal_button').click(function() {
    $('.modal-pop').fadeOut();
    $("#myid").attr('src','');
});