获取 URL 中的 YouTube 视频 ID 并将选择的视频 ID 输入到 URL答案

【问题标题】：Obtaining YouTube video ID in a URL and inputting selected video ID into a URL获取 URL 中的 YouTube 视频 ID 并将选择的视频 ID 输入到 URL
【发布时间】：2010-12-30 16:47:26
【问题描述】：

我在试图弄清楚这一点时遇到了麻烦。我要做的是，从 YouTube 获取视频的 ID，并使用 jQuery 将 11 个字符的 ID 输入到特定 ID 的 div 的 css 中。我知道任何视频缩略图的 URL，但我只需要能够更改 ID 以显示不同的视频缩略图。

<script>
    $(document).ready(function() {
        function(data) {
            videoID = data.split('www.youtube.com/v/')[1].split('&amp')[0];
            $("#304817679").append(videoID);
        });

        $("#304817679").replaceWith("<div id=\"304817679\" " +
            "style=\"background: url(http://img.youtube.com/vi/" + 
            $.function(data) + 
            "/0.jpg) no-repeat middle; width: 15px; height: 150px;\"></div>");
    });
</script>

<div id="304817679">
    <div style="display: none;">
        <object width="248" height="222">
            <param name="movie" value="http://www.youtube.com/v/vy90n2nNRKQ&amp;rel=0&amp;egm=0&amp;showinfo=0&amp;fs=1"></param>
            <param name="wmode" value="transparent"></param>
            <param name="allowFullScreen" value="true"></param>
            <embed src="http://www.youtube.com/v/vy90n2nNRKQ&amp;rel=0&amp;egm=0&amp;showinfo=0&amp;fs=1" type="application/x-shockwave-flash" width="248" height="222" allowFullScreen="true" wmode="transparent"></embed>
        </object>
    </div>
</div>

为了更好地解释这一点，我想要嵌入代码中的 11 字符 YouTube 视频 ID，并将其放入缩略图的 URL (http://img.youtube.com/vi/" + function(data) + "/0.jpg")。这也将替换原来的div (<div id="304817679">)。

我的剧本是否走在正确的轨道上？

【问题讨论】：

标签： jquery youtube

【解决方案1】：

我不太确定您要做什么，但是如果函数没有名称，则无法（之后）调用该函数。也没有定义变量数据。

 $(document).ready(function() {

    //lets give this function a name
    function getID(data) {
        //videoID is parsed nicely
        videoID = data.split('www.youtube.com/v/')[1].split('&amp')[0];

        //this doesn't actually do anything useful since it is replaced afterwards
        $("#304817679").append(videoID);

        //to get a value out of function we need to return it
        return videoID;
    };

    //background style wasn't defined correctly
    //changed to background-image and background-repeat
    //lets also supply getID function HTML as data
    $("#304817679").replaceWith("<div id=\"304817679\" " +
        "style=\"background-image: url(http://img.youtube.com/vi/"  + 
        getID($("#304817679").html()) + 
        "/0.jpg); background-repeat: no-repeat; width: 15px; height: 150px;\"></div>");
});

Demo

【讨论】：

【解决方案2】：

好的，看来您真正想要的是如何查找和替换文本。看看Find & replace jquery

或者您在获取和设置属性时是否遇到问题？

【讨论】：

不，我不认为那是我想要的。视频的视频 ID 显示为：“img.youtube.com/vi/THIS IS WHERE THE ID IS/0.jpg”。我想用嵌入代码中包含的视频 ID 替换 'THIS IS WHERE THE ID IS'：param name="movie" value="youtube.com/v/HERE IS THE ID&rel=0&。虽然它替换了整个 div (
Contents
) 及其内容与另一个 div 的背景图像设置为“img.youtube.com/vi/THIS IS WHERE THE ID IS/0.jpg”
因此，需要找到正则表达式来匹配两个斜杠之间的文本。让我们知道您在这方面的进展情况:)

【解决方案3】：

如果 YouTube 视频的网址是： http://www.youtube.com/user/sothebysrealty?feature=watch

这些类型的网址中没有“id”。如果所有者使用过bitly或类似的，您可以在线反转url，但仍然可以得到类似上面的东西。

我无法弄清楚如何让视频播放器通过 YouTube api 使用该网址。

【讨论】：