在URL结束时告诉jQuery?

时间:2012-02-23 06:55:43

标签: jquery youtube embed vimeo

我使用以下代码将YouTube和Vimeo网址转换为嵌入式广告:

 $('.media-supported li, .blog-post').html(function(i, html) {

    return html.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g, '<div class="media-item"><iframe width="940" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe></div>');

});
$('.media-supported li, .blog-post').html(function(i, html) {

    return html.replace(/(?:http:\/\/)?(?:www\.)?(?:vimeo\.com)\/(?:clip\?v=)?(.+)/g, '<div class="media-item"><iframe src="http://player.vimeo.com/video/$1?title=0&byline=0&portrait=0" width="940" frameborder="0"></iframe></div>');

});

如果它们本身就可以正常工作。然而,当它们被包裹在paragaph中时,它们将结束标记作为URL的一部分。

你可以在这个小提琴中看到我的意思 - http://jsfiddle.net/xH7xK/

是否可以告诉代码URL将完成的位置 - 如果&lt;或者如果是空间,或两者都结束?

1 个答案:

答案 0 :(得分:1)

您可以将正则表达式更改为:

html.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?([^<\s]+)/g, '<div class="media-item"><iframe width="940" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe></div>'));

这结束了&lt;或白色空间。

更好的解决方案是仅匹配Youtube用作视频ID的字母和数字,类似于([a-zA-Z0-9] +),但我不记得id中允许使用哪些字符。