数週間前にスタックで見つけたこのコードがあります。
<script type="text/javascript">
$(document).ready(function() {
// I added the video size here in case you wanted to modify it more easily
var vidWidth = 300; // 425;
var vidHeight = 200; // 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> ';
$('.posthold:contains("youtube.com/watch")').each(function() {
var that = $(this);
var vid = that.html().match(/v=([\w\-]+)/g); // end up with v=oHg5SJYRHA0
that.html(function(i, h) {
return h.replace(/(http:\/\/www.youtube.com\/watch\?v=+\S+\S?)/g, '');
});
if (vid.length) {
$.each(vid, function(i) {
that.append(obj.replace(/\[vid\]/g, this.replace('v=', '')));
});
}
});
});
</script>
URL からの動画の埋め込みに最適です。しかし、解決しようとしている小さな問題がありますが、コードを壊し続けています。
基本的に、次のdiv設定があります
<div class="grid_10 alpha omega posthold" >
<div class="clearfix">
<div class="grid_2 alpha">
<img src="/images/no-image/logo_default.jpg" width="100" height="100" />
</a></div>
<div class="grid_8 omega">
<h1>Some Name Here</h1>
<p>Some Comment here</p>
</div>
</div>
</div>
ここにコメントがある終了段落タグの直後にビデオを表示しようとしています。ユーザーが投稿の一部として動画を入力します。投稿をデータベースに保存し、投稿を引き出すときに、YouTube の URL を埋め込みコードに交換します。これは繰り返し div であるため、ビデオが表示されるインスタンスが多数ある可能性があります。これは可能ですか?最後の終了 div タグの後にビデオが表示される瞬間。