Turn Multiple Youtube/vimeo Links Into Embedded Players

So im trying to convert multiple links into youtube / vimeo embed iframes. It seems to work for a single video inside of the messageText div, but when I add multiple videos, the li

Solution 1:

actually you are using a greedy operator and what you are capturing is not right , a little modification to your regex will do the trick :

use this

(?:http:\/\/|https:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.*?)([^\s]+)

however, you actually dont need to right such a long regex, you can use lookaheads instead. For the time being this will work for you..

similarly you can figure out for vimeo also :)

updated fiddle : http://jsfiddle.net/3Rb5H/2/

cheers !

Solution 2:

html.replace(/(?:http:\/\/|https:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.*?)([^\s]+)/g, '<iframe src="http://www.youtube.com/embed/$2" frameborder="0" allowfullscreen id="videoPlayer" ></iframe>').replace(/(?:http:\/\/|https:\/\/)?(?:www\.)?(?:vimeo\.com)\/(.+)/g, '<iframe id="videoPlayer" src="//player.vimeo.com/video/$1" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>');