使用自动高度在IFrame中获取Google表单

时间:2012-03-22 09:08:30

标签: javascript forms iframe hyperlink autoresize

所以我有一个用Google Docs构建的表单,因为它似乎比从头开始更容易。我已经通过将谷歌网页上的代码复制粘贴到我的域名中的一个来实现这一目的。

我设法通过我在这里找到的这个可爱的小脚本来自动调整它的高度:http://www.frontpagewebmaster.com/m-89000/tm.htm(这不是关于如何动态调整iframe的另一个主题)

function changeContent() { 
document.getElementById('contentDIV').innerHTML = window.frames['contentFRAME'].document.getElementsByTagName('html')[0].innerHTML;
} 

和我显示的页面上的iframe:

<div class="right" id="contentDIV">
<iframe id="contentFRAME" src="raw-form.html" name="contentFRAME" onLoad="changeContent()" style="height:0; width:0; border-width:0;">Loading...</iframe>
</div>

但是现在当我点击提交时,确认或错误页面会在_parent窗口中打开(可能是_top) - 而不是iframe(_self,它应该是默认值?)。目标=&#34;&#34;是折旧的,不起作用。这也发生在iframe内的任何链接。 我尝试过几个不同的调整大小的脚本,但是我还不清楚这一点吗?或者代码实际上并不适用于我的目的?我不确定......以下是我的工作:http://fiendconsulting.com/60minutedesign/form-embed.html

我需要的内容:在首页加载父页面时调整iframe内容大小的内容,并在其_self frame / page /中打开所有链接。
我不关心:调整iframe大小以适应后续网页的内容。如果我点击iframe中的链接,我就不需要将iframe调整为我刚刚访问的任何页面。

我是一名自学成才的程序员,而且我的知识存在一些有趣的差距。我也刚开始学习JS和PHP,并处于Read,Comment和Cannibalize阶段。假设我不知道会更好,如果你告诉我把代码放在哪里(哪个文件和文件中的位置),这对我有帮助。 :)

1 个答案:

答案 0 :(得分:0)

我不确定你要做什么,因为你提供的链接似乎不起作用;但是,我相信你的问题可能是因为你的调整大小功能。

你的职能:

function changeContent() { 
document.getElementById('contentDIV').innerHTML = window.frames['contentFRAME'].document.getElementsByTagName('html')[0].innerHTML;
}

您使用元素'contentDiv',您获取'iframe'的HTML,然后将其设置为您的内容div。这会导致您的“iframe”不再存在。

例如:

让我说我的内容div有这个:

<div class="right" id="contentDIV">
<iframe id="contentFRAME" src="raw-form.html" name="contentFRAME" onLoad="changeContent()" style="height:0; width:0; border-width:0;">Loading...</iframe>
</div>

我的iframe只有一个链接:<a href="www.example.com">Example Link</a>

在您的功能之后,您的contentDiv现在看起来像:

<div class="right" id="contentDIV">
<a href="www.example.com">Example Link</a>
</div>

您已有效删除了iframe,并将iframe(链接)的内容放入主div中。现在,如果您点击该元素,它将自动在同一页面上打开 - 即'父母',但不再有父母了!

所以,前进,你不应该取代内容;相反,你应该修改iframe的高度/宽度。看一下: Adjust width height of iframe to fit with content in it