1
我想在我的网页上实现YouTube视频的延迟加载。为此,我有一个带有HTML注释的YouTube中的iframe代码的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>
继承人的适当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中,替换似乎也发生了,但视频不会加载。
尝试了几种组合,没有成功。
好的,Dunhamzzz在他的想法是正确的,使代码更容易。我改变为每个视频提供者的自己的功能和实施工作。 因此,IE8执行JavaScript后没有激活代码没有问题,IE8有问题与我的代码。
也许我稍后会改进代码,但我的问题本身已得到解答。谢谢。
这是做的很疯狂的方式,你为什么不只是写在函数而不是怪异搜索IFRAME元素和替换你做了语法。 – Dunhamzzz 2012-04-11 11:04:35
问题是,有更多的视频提供商不仅仅是YouTube,所有的视频提供商都采用不同的实施方式 – Phil 2012-04-11 11:11:34
那么在这种情况下,您可以为每一种功能制作不同的功能,至少可以节省您不必更新所有视频链接如果运营商更改其嵌入代码。 另外关于IE8的问题,这可能是因为你把一个iframe放在一个锚标记中,试着将它改为div。 – Dunhamzzz 2012-04-11 11:35:12