我正在创建一个小插件,它获取指向 YouTube、Vimeo、DailyMotion 和 KickStarter 上页面的超链接的 href 值,然后将其转换为嵌入 URL 以显示在灯箱内的 iframe 中。
当然,我来这里的原因是我在让它正常工作时遇到了一些麻烦!这些是它可以接受的可能链接:
http://www.youtube.com/watch?v=[token]
http://www.youtu.be/[token]
http://www.vimeo.com/[token]
http://www.dailymotion.com/video/[token]
http://www.kickstarter.com/projects/[token]/[token]
这些是用于 iframe 的嵌入链接:
http://www.youtube.com/v/[token]
http://player.vimeo.com/video/[token]
https://www.dailymotion.com/embed/video/[token]
https://www.kickstarter.com/projects/[token]/[token]/widget/video.html
这是我目前得到的代码
if (videoURL = href.match(/(youtube|youtu|vimeo|dailymotion|kickstarter)\.(com|be)\/(watch\?v=([\w-]+)|([\w-]+)|video|projects)\/([\w-]+)\/([\w-]+)/)) {
var src = '';
if (videoURL[1] == 'youtube')
src = 'http://www.youtube.com/v/' + videoURL[4];
if (videoURL[1] == 'youtu')
src = 'http://www.youtube.com/v/' + videoURL[3];
if (videoURL[1] == 'vimeo')
src = 'http://player.vimeo.com/video/' + videoURL[3];
if (videoURL[1] == 'dailymotion')
src = 'https://www.dailymotion.com/embed/video/' + videoURL[6];
if (videoURL[1] == 'kickstarter')
src = 'https://www.kickstarter.com/projects/' + videoURL[6] + '/' + videoURL[7] + '/widget/video.html';
if (src) {
var iframe = $('<iframe>', {
src: src,
frameborder: 0,
vspace: 0,
hspace: 0,
scrolling: 'no',
allowfullscreen: ''
});
$container.append(iframe);
}
iframe.load(function() {
$loader.remove();
});
} else {
$this.liteboxError();
$loader.remove();
}
但是目前,只有 KickStarter 视频在运行,其余的只是返回 liteboxError。但是,如果我删除正则表达式的 KickStarter 部分,如下所示:
videoURL = href.match(/(youtube|youtu|vimeo|dailymotion)\.(com|be)\/(watch\?v=([\w-]+)|([\w-]+)|video|)\/([\w-]+)/)
然后只有 DailyMotion 视频在工作,如果我删除 DailyMotion 正则表达式,再次显示,如下所示:
videoURL = href.match(/(youtube|youtu|vimeo)\.(com|be)\/(watch\?v=([\w-]+)|([\w-]+))/)
然后 YouTube 和 Vimeo 视频就可以正常工作了。
只是希望有人能指出我正在使用的正则表达式有什么问题吗?
最佳答案
由于 URL 具有完全不同类型的嵌套来为您提供实际视频的标记,我认为您需要将它们一个嵌套在另一个嵌套中:
(youtu\.be|((youtube|vimeo|dailymotion|kickstarter)\.com))/(watch\?v=([-\w]+)|video/([-\w]+)|projects/([-\w]+)|([-\w]+))
可以查看和测试一些案例here
关于Javascript match() 正则表达式检测 URL 并链接到嵌入内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22840522/