javascript - 网站youtube内嵌视频一直在播放

Question

我正在使用 youtube 提供的 iframe 在我的网站上嵌入视频。

我也在使用我从这个页面学到的 css 弹出窗口 http://www.pat-burt.com/web-development/how-to-do-a-css-popup-without-opening-a-new-window/

所以我的html代码是这样的

<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<font size="4" color="#ffffff"><a style="color: #ffffff" href="javascript:void(null)" onclick="popup('popUpDiv')">Close</a><br></font>
<iframe width="560" height="315" src="http://www.youtube.com/embed/h3Pb6IyFvfg" frameborder="0" allowfullscreen></iframe>
</div>
<a href="javascript:void(null)" onclick="popup('popUpDiv')" class="more_details">more details</a>

一切都按我想要的方式运行，但是如果我在选择关闭以关闭弹出窗口时将浏览器切换到 Internet Explorer 或 Chrome，视频会继续播放吗？我进行了一些谷歌搜索，发现其他人也遇到了同样的问题，但是我只能找到无法正常工作的代码。

基本上，我想在弹出窗口关闭时停止播放视频，该怎么做。感谢您的帮助

Answer 1

我以前遇到过同样的问题。
我所做的是当我关闭弹出窗口时删除 iframe 的 src 并在我用 jQuery 打开它时将其放回。这样，我确定当弹出窗口关闭时视频不会继续播放。

编辑 添加了一个例子:

在包含视频 url 的函数中添加一个可选参数

<a href="javascript:void(null)" onclick="popup('popUpDiv', 'http://www.youtube.com/embed/NWHfY_lvKIQ')" class="more_details">more details</a>

使用视频 url 在函数中设置 iframe 的 src

function popup(pPopup, pYt){ //pYt optional
    $('iframe').attr('src', pYt);
}

当您想要删除源代码时，在您的代码中添加这一行

$('iframe').attr('src', '');