jQuery .ready在动态插入的iframe中 [英] jQuery .ready in a dynamically inserted iframe
问题描述
我们正在使用jQuery thickbox 在有人点击图片时动态显示iframe。在这个iframe中,我们使用 galleria javascript库来显示多张图片。
We are using jQuery thickbox to dynamically display an iframe when someone clicks on a picture. In this iframe, we are using galleria a javascript library to display multiple pictures.
问题似乎是,iframe中的 $(document).ready
似乎过早被触发并且iframe内容甚至还没有加载,所以在DOM元素上没有正确应用galleria代码。 $(document).ready
似乎使用iframe父级就绪状态来判断iframe是否准备就绪。
The problem seems to be that $(document).ready
in the iframe seems to be fired too soon and the iframe content isn't even loaded yet, so galleria code is not applied properly on the DOM elements. $(document).ready
seems to use the iframe parent ready state to decide if the iframe is ready.
如果我们在单独的函数中提取由文档就绪调用的函数,并在超过100毫秒后调用它。它有效,但我们不能利用慢速计算机来生产。
If we extract the function called by document ready in a separate function and call it after a timeout of 100 ms. It works, but we can't take the chance in production with a slow computer.
$(document).ready(function() { setTimeout(ApplyGalleria, 100); });
我的问题:我们应该绑定哪个jQuery事件,以便能够在动态iframe时执行我们的代码准备好了,而不仅仅是它的父母?
My question: which jQuery event should we bind to to be able to execute our code when the dynamic iframe is ready and not just it's a parent?
推荐答案
我回答了类似的问题(参见 IFRAME加载完成后的JavaScript回调?)。
您可以使用以下代码获取对iframe加载事件的控制权:
I answered a similar question (see Javascript callback when IFRAME is finished loading?). You can obtain control over the iframe load event with the following code:
function callIframe(url, callback) {
$(document.body).append('<IFRAME id="myId" ...>');
$('iframe#myId').attr('src', url);
$('iframe#myId').load(function() {
callback(this);
});
}
在处理iframe时,我发现使用load事件而不是文档就绪事件。
In dealing with iframes I found good enough to use load event instead of document ready event.
这篇关于jQuery .ready在动态插入的iframe中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!