пример:
<div class="content"><p>Here is a cool video. Check it out: http://www.youtube.com/watch?v=oHg5SJYRHA0 and this one http://www.youtube.com/watch?v=fLBPsZVI8Gc&feature=player_embedded</p></div> <div class="content"><p>Here is a cool video. Check it out: http://www.youtube.com/watch?v=fLBPsZVI8Gc&feature=player_embedded</p></div>
код обработки:
$(document).ready(function(){ // I added the video size here in case you wanted to modify it more easily var vidWidth = 425; var vidHeight = 344; var obj = '<object width="' + vidWidth + '" height="' + vidHeight + '">' + '<param name="movie" value="http://www.youtube.com/v/[vid]&hl=en&fs=1">' + '</param><param name="allowFullScreen" value="true"></param><param ' + 'name="allowscriptaccess" value="always"></param><em' + 'bed src="http://www.youtube.com/v/[vid]&hl=en&fs=1" ' + 'type="application/x-shockwave-flash" allowscriptaccess="always" ' + 'allowfullscreen="true" width="' + vidWidth + '" ' + 'height="' + vidHeight + '"></embed></object> '; $('.content:contains("youtube.com/watch")').each(function(){ var that = $(this); var vid = that.html().match(/(?:v=)([\w\-]+)/g); // end up with v=oHg5SJYRHA0 if (vid.length) { $.each(vid, function(){ that.append( obj.replace(/\[vid\]/g, this.replace('v=','')) ); }); } }); });
замена кода на картинку + при клике открытие видео:
пример кода:
<div class="comment"> [youtube]http://www.youtube.com/watch?v=T1hf4B5pyjQ&feature=grec_index[/youtube] random text </div>
код поиска и замены
var youtubeTag = /\[youtube]https?:\/\/(?:www\.)?youtu(?:be\.com|\.be)\/(?:watch\?v=|v\/)?([A-Za-z0-9_-]+)([a-zA-Z&=;_+0-9*#-]*?)\[\/youtube]/; var youtubeHTML = '<img width="420" data-address="$1" height="315" class="youtube" src="http://i4.ytimg.com/vi/$1/hqdefault.jpg"></img>'; var youtubeIFRAME = '<iframe width="420" height="315" class="youtube" src="http://www.youtube.com/embed/$1?rel=0" frameborder="0" allowfullscreen></iframe>'; $(".comment").each(function(){ var $this = $(this); $this.html($this.html().replace(youtubeTag, youtubeHTML)); }); $("img.youtube").click(function(){ var $this = $(this); $this.replaceWith(youtubeIFRAME.replace("$1", $this.attr("data-address"))); });
+ YouTube Lazy Loader или YouTube - Changing the image on your YouTube embed