0

我正在尝试访问 iFrame 的内容，但我无处可去。

我有这个：

that.findGadget = $.fn.findGadget = function (root) {
    var root = root || this;
    if (root[0].tagName === "IFRAME") {
       root = root[0].contentDocument || root[0].contentWindow.document;
    }
    console.log(root);

};

我在 iFrame 本身上调用该函数，如下所示：

// options is my configuration object with id/src/...
var newHTML = document.createElement("iframe");
newHTML.setAttribute("src", options.src);
newHTML.setAttribute("frameborder", 0);
newHTML.setAttribute("data-id", options.id);
// add iFrame to page
// options.parent is a $(element)
newParentElement = options.parent.parent()[0];
options.parent.replaceWith( newHTML );

// select
var newRootElement = newParentElement.querySelectorAll(
    '[data-id="'+options.id+'"]'
  );
// calling on $('iframe')
$( newRootElement[0] ).findGadget();
...

我的 if 语句里面的findGadget工作正常，所以root设置为documentiFrame。但是我被困在那里，因为我正在尝试的其他一切：

root.body
root.body.innerHTML
$(root).find('div');
$('iframe').contents();

未定义或空选择器。

问题：
如何正确访问 iFrame 的元素？问题可能是内容尚未加载吗？我正在处理本地存储，所以所有文件都来自同一个“域”。

感谢帮助！

4

2 回答 2

1

对，您需要等到 iframe 内容加载完毕。使用 jQuery：

$('iframe').load(function () {                        
    // access the iframe content
});
于 2013-05-22T05:38:30.430 回答
1

考虑以下：

1）我建议在findGadget()加载 iframe 时触发该功能。您可以通过从 iframe 页面本身调用它或将整体$(newRootElement[0] ).findGadget();放入

$(newRootElement[0]).ready(function (){
    // here
});

2）我建议仅使用contentWindow它，因为它与所有浏览器完全兼容（经过测试）。

于 2013-05-21T20:47:25.750 回答