我在 Bootstrap 视频中有一个 Vimeo iframe 视频。我需要在触发模态时开始播放，并在模态关闭时停止播放。目前，我可以通过使用没有 src 属性的 iframe 并在触发模态时填充 jQuery 来开始在模态打开时播放。这是代码片段；

    jQuery("#videogumb").click(function() { 
    jQuery('#myModal .modal-body iframe').attr('src','the-source-code'); 
    }); 

这工作正常，当模态打开时我开始启动它，但是当我关闭模态时，音乐继续在后台播放。

另一种方法在但仅用于关闭模式而不将其设置为自动播放时工作正常。所以自动播放设置为0，我有这个片段；

    jQuery(".modal-backdrop, #myModal .close, #myModal .btn").live("click", function() { 
    jQuery("#myModal iframe").attr("src", jQuery("#myModal iframe").attr("src")); 
    }); 

当我关闭模式时，这会停止视频。
我需要以某种方式将其结合起来。我需要在模态打开时自动播放并在模态关闭时停止播放。

有什么线索吗？

谢谢。

请您参考如下方法:

要添加到 eroedig 的答案，请查看 Vimeo 的文档 Calling the API with Froogaloop .

在通用嵌入代码中添加 ?api=1&player_id=vimeoplayer，例如:

<iframe src="//player.vimeo.com/video/116160160?api=1&player_id=vimeoplayer&title=0&amp;byline=0&amp;portrait=0" name="vimeoplayer" id="nofocusvideo" width="615" height="346" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

注意 - 我给了它一个名为 'nofocusvideo' 的 ID，将在此处看到:

var iframe = document.getElementById('nofocusvideo');

在 eroedig 的 JS 上方声明 2 个变量，例如:

<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script> 
<script> 
var iframe = document.getElementById('nofocusvideo'); 
// $f == Froogaloop 
var player = $f(iframe); 
 
$('.modal').on('hidden.bs.modal', function () { 
player.api('pause'); 
}) 
 
$('.modal').on('shown.bs.modal', function () { 
player.api('play'); 
}) 
</script>