解析 youtube 输入链接并使用 jquery 获取 youtube ID ？答案

【问题标题】：parse youtube input links and get youtube ID using jquery ?解析 youtube 输入链接并使用 jquery 获取 youtube ID ？
【发布时间】：2011-11-27 12:13:06
【问题描述】：

我知道很多人经常问这种问题，但不幸的是我无法解决我的问题。

我的 textarea 编辑器中有这段代码用于输入 youtube 链接：

{name:'youtube', key:'Y', replaceWith:'[youtube][![Youtube video Url]!][/youtube]'},

它会在弹出窗口中询问 youtube 视频 url，然后它将 url 放在 [youtube] 和 [/youtube] 之间。

我想添加一个 youtube 解析器，然后如果成员输入 youtube url，它将解析 url 并获取 youtube 视频 ID 并将其输入到文本区域，如下所示：

[youtube] ID [/youtube]

提前感谢您的帮助。

【问题讨论】：

标签： jquery parsing video youtube

【解决方案1】：

function getYoutubeId(str){
   if(str.indexOf('youtube.com/') != -1 || str.indexOf('youtu.be/') != -1){
      var idStr = str.match(/([\&|\?]v\=|youtu\.be\/)([^\&\/\?]*)/);
      if(typeof(idStr[2]) != 'undefined'){
         return idStr[2]; 
      };
   };
   return null;
};

【讨论】：

【解决方案2】：

function getVideoId(url){
    if(url.indexOf('?') === -1)
        return null;
    var query = decodeURI(url).split('?')[1];
    var params = query.split('&');      
    for(var i=0,l = params.length;i<l;i++)
        if(params[i].indexOf('v=') === 0)
            return params[i].replace('v=','');
    return null;
}

  var url = "http://www.youtube.com/watch?v=yV3i6OoiR4w&feature=BFa&list=PL4A312BE02BA06BB7&lf=bf_play";
  alert(getVideoId(url));

更新：另一种解决方案是使用正则表达式：

var url = "http://www.youtube.com/watch?v=yV3i6OoiR4w&feature=BFa&list=PL4A312BE02BA06BB7&lf=bf_play";
var videoUrl = url.replace(/^.*?(\?|&)(v=([^&]+)).*$/i,'$3');

【讨论】：

【解决方案3】：

youtube URL 有一种新的缩短 URL 格式...这是一个更新的脚本以适应这两种类型。

function getVideoId(url){
    if(url.indexOf('?') != -1 ) {
        var query = decodeURI(url).split('?')[1];
        var params = query.split('&');
        for(var i=0,l = params.length;i<l;i++)
            if(params[i].indexOf('v=') === 0)
                return params[i].replace('v=','');
    } else if (url.indexOf('youtu.be') != -1) {
        return decodeURI(url).split('youtu.be/')[1];
    }
    return null;
}
var urlLONG = "http://www.youtube.com/watch?v=UF8uR6Z6KLc&feature=feedlik";
var urlSHORT = "http://youtu.be/UF8uR6Z6KLc";
alert(getVideoId(urlLONG));
alert(getVideoId(urlSHORT));

附：我是一名 Flash 开发人员，只在 AS3 中测试过，但是像这样的简单内容在两种语言中都是相同的。如果你想在 AS3 中使用它，只需将 alert() 与 trace() 交换即可。

编码愉快！

【讨论】：