不幸的是，这些 API 的发展非常快。截至 2015 年 5 月，提议的解决方案不再有效，因为玩家对象没有stopVideo方法。

在此页面 ( 1 ) 中可以找到一个可靠的解决方案，它适用于：

<iframe id="youtube_player" class="yt_player_iframe" width="640" height="360" src="http://www.youtube.com/embed/aHUBlv5_K8Y?enablejsapi=1&version=3&playerapiid=ytplayer"  allowfullscreen="true" allowscriptaccess="always" frameborder="0"></iframe>

以及以下 JS/jQuery 代码：

$('.yt_player_iframe').each(function(){
  this.contentWindow.postMessage('{"event":"command","func":"stopVideo","args":""}', '*')
});

如果有人仍在寻找答案，我已经这样解决了：

$("#photos").on("hide",function(){
    var leg=$('.videoPlayer').attr("src");
    $('.videoPlayer').attr("src",leg);
});

其中 #photos 是模式的 ID， .videoPlayer 是 iframe 的类。基本上它会刷新 src 属性（并停止播放视频）。所以，

    $('#myStopClickButton').click(function(){
      $('.yvideo').each(function(){
        var el_src = $(this).attr("src");
        $(this).attr("src",el_src);
      });
    });

应该做的伎俩。

您可能需要查看Youtube JavaScript API参考文档。

当您在页面上嵌入视频时，您需要传递此参数：

http://www.youtube.com/v/VIDEO_ID?version=3&enablejsapi=1

如果您想要停止所有视频按钮，您可以设置一个 javascript 例程来循环播放您的视频并停止它们：

player.stopVideo()

这确实涉及跟踪页面上每个视频的所有页面 ID。更简单的方法可能是创建一个类，然后使用 jQuery.each。

$('#myStopClickButton').click(function(){
  $('.myVideoClass').each(function(){
    $(this).stopVideo();
  });
});

这是一个codepen，它对我有用。

我正在寻找在 iframe 中嵌入 YT 视频的最简单的解决方案，我觉得就是这样。

我需要的是让视频出现在模式窗口中并在关闭时停止播放

这是代码：（来自：https : //codepen.io/anon/pen/GBjqQr）

    <div><a href="#" class="play-video">Play Video</a></div>
    <div><a href="#" class="stop-video">Stop Video</a></div>
    <div><a href="#" class="pause-video">Pause Video</a></div>

    <iframe class="youtube-video" width="560" height="315" src="https://www.youtube.com/embed/glEiPXAYE-U?enablejsapi=1&version=3&playerapiid=ytplayer" frameborder="0" allowfullscreen></iframe>

$('a.play-video').click(function(){
    $('.youtube-video')[0].contentWindow.postMessage('{"event":"command","func":"' + 'playVideo' + '","args":""}', '*');
});

$('a.stop-video').click(function(){
    $('.youtube-video')[0].contentWindow.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}', '*');
});

$('a.pause-video').click(function(){
    $('.youtube-video')[0].contentWindow.postMessage('{"event":"command","func":"' + 'pauseVideo' + '","args":""}', '*');
});

此外，如果您希望它在尚不可见的 DOM 对象（例如模态窗口）中自动播放，如果我使用相同的按钮来播放我用来显示模态的视频，它将无法工作，所以我使用这：

https://www.youtube.com/embed/EzAGZCPSOfg?autoplay=1&enablejsapi=1&version=3&playerapiid=ytplayer

注意：?autoplay=1&放置它的位置以及在 next 属性之前使用“&”以允许暂停继续工作。

API 很混乱，因为它们一直在变化。这种纯 javascript 方式对我有用：

 <div id="divScope" class="boom-lightbox" style="display: none;">
    <iframe id="ytplayer" width="720" height="405"   src="https://www.youtube.com/embed/M7lc1UVf-VE" frameborder="0" allowfullscreen>    </iframe>
  </div>  

//if I want i can set scope to a specific region
var myScope = document.getElementById('divScope');      
//otherwise set scope as the entire document
//var myScope = document;

//if there is an iframe inside maybe embedded multimedia video/audio, we should reload so it stops playing
var iframes = myScope.getElementsByTagName("iframe");
if (iframes != null) {
    for (var i = 0; i < iframes.length; i++) {
        iframes[i].src = iframes[i].src; //causes a reload so it stops playing, music, video, etc.
    }
}