小编典典

jQuery .ready 在动态插入的 iframe 中

all

当有人点击图片时,我们正在使用 jQuery厚框动态显示 iframe。在这个
iframe 中,我们使用Galleria一个
javascript 库来显示多张图片。

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

如果我们将 document ready 调用的函数提取到一个单独的函数中,并在超时 100ms
后调用它。它可以工作,但我们不能在生产速度慢的计算机上冒险。

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

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


阅读 52

收藏
2022-07-27

共1个答案

小编典典

我回答了一个类似的问题。您可以使用以下代码控制 iframe 加载事件:

function callIframe(url, callback) {
    $(document.body).append('<IFRAME id="myId" ...>');
    $('iframe#myId').attr('src', url);

    $('iframe#myId').load(function() {
        callback(this);
    });
}

在处理 iframe 时,我发现使用加载事件而不是文档就绪事件已经足够好了。

2022-07-27