jQuery UI iframe 问题

Question

我为我们的慈善组织开发了一个用于 Web 仪表板的 iframe，这给我的 jQuery UI 带来了一些问题。

在实际的 iframe 上，选项卡和手风琴没有按预期运行。在页面顶部，您会看到一对，但实际上不能从一个更改为另一个。 http://www.thegaiaproject.ca/charts/realtime-iframe.php?location=18

奇怪的是，一旦 iframe 加载到我们的 drupal 站点中，iframe 就会完美运行。 http://www.thegaiaproject.ca/data/realtime-test?location=18

不幸的是，当 iframe 加载到另一个组织的 Wordpress 网站上时，情况就不是这样了。

有什么想法吗？我一直在尝试调试这个几个小时。我已经尝试过加载所有由 drupal 调用的外部脚本，以查看其中一个是否必要——但这对我没有帮助。

Answer 1

问题在于页面要求自身位于 iframe 中。我注意到每次选择一个选项卡时，它都会调用以下函数：

function sizeFrame() {
    var F = window.parent.document.getElementById("realtime-dashboard");
    if(F.contentDocument) {
        F.height = F.contentDocument.documentElement.scrollHeight+30; //FF 3.0.11, Opera 9.63, and Chrome
    } 
    else {
        F.height = F.contentWindow.document.body.scrollHeight+30; //IE6, IE7 and Chrome
    }       
}

在执行此函数时，它正在寻找一个父文档（其中没有）并为我抛出错误F is null（在 Firefox 的错误控制台中），然后触发其余的 javascript。

尝试在处理 iframe 不存在的函数中添加 test-for-null if 语句，我怀疑它会导致页面的其余部分按预期工作。

希望对你有帮助。