如何动态添加 wmode=transparent 到 Youtube 嵌入代码？

Question

我有几个由客户通过 CMS 添加的 Youtube 视频。我需要将以下内容添加到所有 Youtube src 链接：

?wmode=transparent

我该怎么做？

Youtube 嵌入代码的示例如下：

<iframe width="515" height="292" src="http://www.youtube.com/embed/p8IB-5PbL9U" frameborder="0" allowfullscreen></iframe>

这样做的原因是因为我有一个位于 Youtube 视频后面的 javascript 菜单，并且我读到这就是修复它的方法。

客户端根本不具备技术性，只是让他们从 Youtube 获取嵌入代码很困难，因此需要动态添加。

Answer 1

如果您只需要向所有框架添加 ?wmode=transparent ，请使用以下 JS 代码：

window.onload = function() {
    var frames = document.getElementsByTagName("iframe");
    for (var i = 0; i < frames.length; i++) {
        frames[i].src += "?wmode=transparent";
    }
}

Answer 2

您固定使用 iframe 吗？由于您无法直接访问底层对象，这使得这变得更加困难。如果可以的话，最好直接将对象嵌入到您的页面上

<object width="515" height="292">
<param name="movie" value="http://www.youtube.com/v/p8IB-5PbL9U"></param>
<param name="allowFullScreen" value="true"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/p8IB-5PbL9U"
  type="application/x-shockwave-flash"
  allowfullscreen="true"
  wmode="transparent"
  width="515" height="292">
</embed>
</object>

Answer 3

根据您的 CMS，您可以通过纯 PHP 来完成此操作，只需将其添加到每个 url 的末尾，或者您的或让 jQuery 为您完成工作。

$('iframe').each(function() {
    $(this).attr("src", $(this).attr("src") + '?wmode=transparent')
});