Question

自从Fancybox 1.3.4升级到Fancybox 2.1.4后，我无法获得正确的href媒体资源以使用我的YouTube视频。

请查看我正在尝试修改的jsfiddle这个工作。

简单地说，我想要做的就是从每个链接的URL中删除尾随&autoplay=1并将其添加到脚本内的href属性中。当我尝试这样做时，fancybox会打开但youtube视频无法播放并报告一般错误。

有人可以帮我修改这段代码吗？

这是html：

<a href="http://www.youtube.com/watch?v=opj24KnzrWo&amp;autoplay=1">open youtube video</a>

<br />

<a href="http://www.youtube.com/watch?v=071KqJu7WVo&amp;autoplay=1">open youtube video 2</a>

和javascript：

(function ($) {
  $(document).ready(function(){
    $('a[href*=youtube]').each(function () {
        // convert youtube swf href to embed for iframe
        var thisHref = this.href.replace(new RegExp("watch\\?v=", "i"), 'embed/').replace(new RegExp("&", "i"), '?');
        // bind fancybox to each anchor
        $(this).fancybox({
        "padding": 0,
        "type": 'iframe',
        // add trailing parameters to href (wmode)
        "href" : thisHref+"&amp;wmode=opaque"
        }); // fancybox
    }); // each
  }); // ready
})(jQuery);`

感谢。

Answer 1

对于没有任何尾随参数的此类链接：

<a href="http://www.youtube.com/watch?v=opj24KnzrWo">open youtube video</a>
<a href="http://www.youtube.com/watch?v=071KqJu7WVo">open youtube video 2</a>

使用此代码

(function ($) {
  $(document).ready(function(){
    $('a[href*=youtube]').each(function () {
        // convert youtube swf href to embed for iframe
        var thisHref = this.href.replace(new RegExp("watch\\?v=", "i"), 'embed/');
        // bind fancybox to each anchor
        $(this).fancybox({
            "padding": 0,
            "type": 'iframe',
            // add trailing parameters to href (wmode) AND autoplay    
            "href" : thisHref+"?wmode=opaque&amp;autoplay=1"
        }); // fancybox
    }); // each
  }); // ready
})(jQuery);

您在上一个示例中遇到的问题是，wmode=opaque是您的第二参数，因此需要前一个&

"href" : thisHref+"&amp;wmode=opaque"

但由于您要从链接中删除所有尾随参数，因此wmode=opaque成为第一个参数，因此需要先前的?而不是

"href" : thisHref+"?wmode=opaque&amp;autoplay=1"

查看新的 JSFIDDLE

修改href属性（在此JSFiddle中）以使用Fancybox中的youtube视频

1 个答案: