使用 jQuery 附加 YouTube 视频嵌入？

Question

我需要将“&rel=0”添加到 YouTube 嵌入代码的结束 SRC 标记的末尾。就在“xCODE NEEDS TO GO HEREx”放置的地方是我需要放置 &rel=0 的地方。有没有办法使用 jQuery 的 Append 函数来做到这一点？

<embed src="http://www.youtube.com/v/S6I6Fc5mJeE&hl=en_US&fs=1xCODE NEEDS TO GO HEREx" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="284" height="171"></embed>

我需要此功能，因为我们的网站上有多个视频，并且必须找到正确的数据库表并对其进行修改以纠正此问题是一件很痛苦的事情。

请帮忙！

亚当

Answer 1

试试这个：

 var __mainDiv;
 var __preLoaderHTML;
 var __opts;

 function __jQueryYouTubeChannelReceiveData(data) {

     var cnt = 0;

     $.each(data.feed.entry, function(i, e) {
         if (cnt < __opts.numberToDisplay) {
             var parts = e.id.$t.split('/');
             var videoId = parts[parts.length-1];
             var out = '<div class="video"><a href="' + 
                  e.link[0].href + '"><img src="http://i.ytimg.com/vi/' + 
                  videoId + '/2.jpg"/></a><br /><a href="' + 
                  e.link[0].href + '">' + e.title.$t + '</a><p>';
             if (!__opts.hideAuthor) {
                 out = out + 'Author: ' + e.author[0].name.$t + '';
             }
             out = out + '</p></div>';
             __mainDiv.append(out);
             cnt = cnt + 1;
         }
     });

    // Open in new tab?
    if (__opts.linksInNewWindow) {
        $(__mainDiv).find("li > a").attr("target", "_blank");
    }

    // Remove the preloader and show the content
    $(__preLoaderHTML).remove();
    __mainDiv.show();
}

(function($) {
    $.fn.youTubeChannel = function(options) {
        var videoDiv = $(this);

        $.fn.youTubeChannel.defaults = {
            userName: null,
            channel: "favorites", //options are favorites or uploads
            loadingText: "Loading...",
            numberToDisplay: 3,
            linksInNewWindow: true,
            hideAuthor: false
        }

        __opts = $.extend({}, $.fn.youTubeChannel.defaults, options);

        return this.each(function() {
            if (__opts.userName != null) {
                videoDiv.append("<div id=\"channel_div\"></div>");
                __mainDiv = $("#channel_div");
                __mainDiv.hide();

                __preLoaderHTML = $("<p class=\"loader\">" + 
                    __opts.loadingText + "</p>");
                videoDiv.append(__preLoaderHTML);

                // TODO: Error handling!
                $.ajax({
                    url: "http://gdata.youtube.com/feeds/base/users/" + 
                        __opts.userName + "/" + __opts.channel + "?alt=json",
                    cache: true,
                    dataType: 'jsonp',                    
                    success: __jQueryYouTubeChannelReceiveData
                });
            }
        });
    };
})(jQuery);

要使用 YouTube 插件，您只需添加对 jQuery 库和 jquery.youtube.channel.js 文件的脚本引用。然后添加一个容器来保存渲染的 HTML，一行 JavaScript 来连接所有内容，以及一些 CSS 来格式化输出：

<script type=”text/javascript” src=”jquery.youtube.channel.js”></script>

<div id="youtubevideos"></div>

<script type="text/javascript">
$(document).ready(function() {
$('#youtubevideos').youTubeChannel({
userName: 'diggerdanh',
channel: "favorites",
hideAuthor: false,
numberToDisplay: 6,
linksInNewWindow: true
//other options
//loadingText: "Loading...",
});
});
</script>

Answer 2

你有什么理由不能用常规的 ol' jQuery 做到这一点吗？

$('embed[src^=http://www.youtube.com/]').attr('src', function (i, v)
{
    return v + '&rel=0';
});

似乎对我有用。 http://jsfiddle.net/mattball/tt3AG/

Answer 3

我会做类似这样未经测试的 jQuery 语句：

$("embed[src]").attr("src", this.attr("src") + "&rel=0");