在动态插入的iframe中做好准备

在动态插入的iframe中做好准备

我们使用jQuery厚箱当某人单击图片时动态显示iframe。在这个iframe中,我们正在使用盖瑞用于显示多幅图片的javascript库。

问题似乎是$(document).ready在iframe中,启动得太快,iframe的内容甚至还没有加载,因此Galleria代码没有正确地应用于DOM元素。$(document).ready似乎使用iframe父准备状态来决定iframe是否就绪。

如果我们在一个单独的函数中提取文档调用的函数,并在超时100 ms之后调用它。它能工作,但我们不能冒险用一台缓慢的计算机进行生产。

$(document).ready(function() { setTimeout(ApplyGalleria, 100); });

我的问题是:当动态iframe准备好而不仅仅是父事件时,我们应该绑定哪个jQuery事件来执行我们的代码?


跃然一笑
浏览 458回答 3
3回答

暮色呼如

我回答了一个类似的问题(见当iframe完成加载时JavaScript回调?)。您可以使用以下代码获得对iframe Load事件的控制:function&nbsp;callIframe(url,&nbsp;callback)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;$(document.body).append('<IFRAME&nbsp;id="myId"&nbsp;...>'); &nbsp;&nbsp;&nbsp;&nbsp;$('iframe#myId').attr('src',&nbsp;url); &nbsp;&nbsp;&nbsp;&nbsp;$('iframe#myId').load(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;callback(this); &nbsp;&nbsp;&nbsp;&nbsp;});}在处理iframes时,我发现可以使用Load事件而不是DocumentReadyEvent。

动漫人物

使用jQuery1.3.2,以下内容对我有用:$('iframe').ready(function()&nbsp;{ &nbsp;&nbsp;$('body',&nbsp;$('iframe').contents()).html('Hello&nbsp;World!');});修订:!实际上,上面的代码有时看起来像是在Firefox中工作,而不是在Opera中工作。相反,我为我的目的实现了一个轮询解决方案。简化如下:$(function()&nbsp;{ &nbsp;&nbsp;function&nbsp;manipIframe()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;el&nbsp;=&nbsp;$('body',&nbsp;$('iframe').contents()); &nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(el.length&nbsp;!=&nbsp;1)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;setTimeout(manipIframe,&nbsp;100); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return; &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;el.html('Hello&nbsp;World!'); &nbsp;&nbsp;} &nbsp;&nbsp;manipIframe();});这不需要调用iframe页面中的代码。所有代码驻留并从父框架/窗口执行。

慕桂英3389331

在IFrames中,我通常通过在块的末尾放置一个小脚本来解决这个问题:<body>The&nbsp;content&nbsp;of&nbsp;your&nbsp;IFrame<script&nbsp;type="text/javascript">//<![CDATA[ &nbsp;&nbsp;&nbsp;fireOnReadyEvent(); &nbsp;&nbsp;&nbsp;parent.IFrameLoaded();//]]></script></body>这对我来说大部分时间都是有用的。有时最简单、最天真的解决方案是最合适的。
打开App,查看更多内容
随时随地看视频慕课网APP