自分のウェブページにYouTubeビデオの遅延ロードを実装したいと思います。このため、YouTubeのiframeコードをHTMLタグに付けたa-Tagがあります。さらに、onclickイベントがあります。このイベントは、コメントタグを置き換えてYouTubeコードをアクティブにします。ここで置き換えられたJSの代わりに置き換えられた後にHTMLが実行されない
はHMTLの例です:
<a href="http://www.youtube.com/watch?v=KC2zbOwbeEs&hd=1" class="video-in-link" style="background:url('http://i.ytimg.com/vi/KC2zbOwbeEs/hqdefault.jpg') no-repeat center center; width:500px; height:281px;" onclick="videoInLink(this);">
<!-- xxltxxiframe width="500" height="281" src="http://www.youtube.com/embed/KC2zbOwbeEs?fs=1&feature=oembed&autoplay=1" frameborder="0" allowfullscreenxxgtxxxxltxx/iframexxgtxx -->
</a>
HERESに適切なJS:
function videoInLink(anchor){
anchor.innerHTML = anchor.innerHTML.replace(/xxltxx/gi,'<');
anchor.innerHTML = anchor.innerHTML.replace(/xxgtxx/gi,'>');
anchor.innerHTML = anchor.innerHTML.replace(/<!--/,'');
anchor.innerHTML = anchor.innerHTML.replace(/-->/,'');
anchor.style.background="none";
anchor.removeAttribute('href');
anchor.onclick= null;
return false;
}
すべてがFirefoxとChromeで結構です:コンテンツが置き換えられますとビデオが始まります。 IE8では、置き換えも起こるようですが、ビデオは読み込まれません。
いくつかの組み合わせを試してみましたが、成功しませんでした。
OK、Dunhamzzzは、コードを簡単にしていると思っていました。各ビデオプロバイダの独自の機能に変更され、実装が機能します。 IE8はJavaScriptの実行後にコードをアクティブにすることに問題はなく、IE8は自分のコードに問題がありました。
おそらく私は後でコードを改善するつもりですが、私の質問自体には答えがあります。ありがとう。
これは非常に奇妙な方法です。あなたが作った構文ではなく、関数内にiframe要素を書いて置き換えてみてください。 – Dunhamzzz
問題は、ちょうどYouTube以外のビデオプロバイダがあり、そのすべてがビデオプレーヤーの実装が異なる – Phil
その場合、それぞれの機能が異なるため、すべてのビデオを更新する必要はありませんキャリアが埋め込みコードを変更した場合にリンクします。 また、IE8の問題については、アンカータグにiframeを配置している可能性が高いため、divに変更してみてください。 – Dunhamzzz