javascript - iframe 加载函数未定义

Question

我正在开发 Rails 应用程序。其中一项功能是为客户提供预览 HTML 页面的能力。我在 IFRAME 中加载这些预览，以便预览容器的 CSS/样式与预览本身的 CSS/样式分开。到目前为止，这工作得很好。

我遇到的一个问题是在加载 IFRAME 后自动调整其大小。只需通过 jQuery 将函数附加到 IFRAME 的 load 事件，我就可以在 Chrome 中很好地工作:

var show_preview = function() {
  $("#preview-loading").hide();
  $(this).show();
  this.style.height = this.contentWindow.document.body.scrollHeight + "px";
  return this.style.width = this.contentWindow.document.body.scrollWidth + "px";
}

$(function() {     
  return $("#preview_frame").load(function() {
    show_preview();
  });
});

这在 IE 中效果不佳，但是 - 页面首次加载时似乎没有触发该事件。

我正在尝试的一种解决方法是将函数直接分配给 IFRAME 的 onload 属性，如下所示:

 <iframe onload="show_preview();" ...></iframe>

我在这里遇到的问题是 IFRAME 无法找到 show_preview() 函数(如果它在我的 JavaScript 文件中定义)。如果我提取函数并将其放在 IFRAME 上方的 SCRIPT 标记中，一切正常。

感谢任何帮助 - 当然我正在做一些愚蠢的事情。

最大

Answer 1

将您的函数附加到窗口对象，然后它将在您的 html 代码中可见:

window.show_preview = function() { ... }