Javascript – 将youtube / vimeo url转换为嵌入版本,用于论坛评论function

在此处输入图像描述

试图制作类似于facebook的东西。 我已经创建了这个javascript url模式转换器。 这样的事情可以在用户点击论坛post的提交按钮时触发 – 将url转换为嵌入html变体。 有什么方法可以改善吗?

http://jsfiddle.net/88Ms2/377/

var videoEmbed = { invoke: function(){ $('body').html(function(i, html) { return videoEmbed.convertVideo(html); }); }, convertVideo: function(html){ var pattern1 = /(?:http?s?:\/\/)?(?:www\.)?(?:vimeo\.com)\/?(.+)/g; var pattern2 = /(?:http?s?:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g; if(pattern1.test(html)){ console.log("html", html); var replacement = ''; var html = html.replace(pattern1, replacement); } if(pattern2.test(html)){ console.log("html", html); var replacement = ''; var html = html.replace(pattern2, replacement); } return html; } } setTimeout(function(){ videoEmbed.invoke(); },3000); 

最新代码******** http://jsfiddle.net/88Ms2/378/

这模仿了Facebookpostfunction – 将YouTube,vimeo或图像转换为基于媒体的链接。 这将有助于继续

有兴趣增强代码。

 var videoEmbed = { invoke: function(){ $('body').html(function(i, html) { return videoEmbed.convertMedia(html); }); }, convertMedia: function(html){ var pattern1 = /(?:http?s?:\/\/)?(?:www\.)?(?:vimeo\.com)\/?(.+)/g; var pattern2 = /(?:http?s?:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g; var pattern3 = /([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[az]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:jpg|jpeg|gif|png))/gi; if(pattern1.test(html)){ var replacement = ''; var html = html.replace(pattern1, replacement); } if(pattern2.test(html)){ var replacement = ''; var html = html.replace(pattern2, replacement); } if(pattern3.test(html)){ var replacement = '
'; var html = html.replace(pattern3, replacement); } return html; } }

以下是将几种类型的媒体转换为嵌入或其他有用格式的函数集合。 还处理诸如text link.com/file.jpg text输入。 归功于老县,因为这是建立在他的代码之上。

 function convert_youtube(input) { var pattern = /(?:http?s?:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(\S+)/g; if (pattern.test(input)) { var replacement = ''; var input = input.replace(pattern, replacement); // For start time, turn get param & into ? var input = input.replace('&t=', '?t='); } return input; } function convert_vimeo(input) { var pattern = /(?:http?s?:\/\/)?(?:www\.)?(?:vimeo\.com)\/?(\S+)/g; if (pattern.test(input)) { var replacement = ''; var input = input.replace(pattern, replacement); } return input; } function convert_twitch(input) { var pattern = /(?:http?s?:\/\/)?(?:www\.)?(?:twitch\.tv)\/?(\S+)/g; if (pattern.test(input)) { var replacement = ''; var input = input.replace(pattern, replacement); } return input; } function convert_vocaroo(input) { var pattern = /(?:http?s?:\/\/)?(?:www\.)?(?:vocaroo\.com\/i)\/?(\S+)/g; if (pattern.test(input)) { var replacement = ''; var input = input.replace(pattern, replacement); } return input; } function convert_video_url(input) { var pattern = /([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[az]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:webm|mp4|ogv))/gi; if (pattern.test(input)) { var replacement = ''; var input = input.replace(pattern, replacement); } return input; } function convert_image_url(input) { var pattern = /([-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[az]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?(?:jpg|jpeg|gif|png))/gi; if (pattern.test(input)) { var replacement = '
'; var input = input.replace(pattern, replacement); } return input; } // Run this function last function convert_general_url(input) { // Ignore " to not conflict with other converts var pattern = /(?!.*")([-a-zA-Z0-9@:%_\+.~#?&//=;]{2,256}\.[az]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=;]*))/gi; if (pattern.test(input)) { var replacement = 'https://stackoverflow.com/questions/22544625/javascript-convert-youtube-vimeo-urls-into-embed-versions-for-use-on-a-forum/$1'; var input = input.replace(pattern, replacement); } return input; }