重新加载后javascript找不到iframe

Posted 2023-05-09

【中文标题】重新加载后javascript找不到iframe

【英文标题】：javascript can't find iframe after reload

【发布时间】：2013-03-09 05:20:48

【问题描述】：

我不是在寻求解决方案，因为我解决了问题。这更像是“为什么会发生”？理解是一切的根源，我不知道为什么会这样。

我有一个包含两个分层 div（Div 1 和 Div 2）的网页。 Div1 显示一个按钮，单击时显示 Div 2，其中包含一个表单和一个 iframe（名为“myframe”）。 当用户在 Div 2 中单击“取消”时，Div 2 被清空并消失，再次显示 Div 1。 一切都是使用 Ajax 和 php 加载的。

我的问题： 第一次单击 Div 1 中的按钮时，一切都显示正常，而且 - 最重要的是 - 我可以使用 javascript 访问 iframe。

两者

var b=window.frames['myframe']
and 
var b=window.frames[0]

导致 alert(b.name) 显示“myframe”。

然而，奇怪的是，当我取消 Div 2（清空并隐藏它），然后使用完全相同的代码再次按下 Div 1 中的按钮时，在引用 iframe 时，我在 javascript 中给出了“NULL”。 我检查了 DOM，Div 2 在取消后确实是空的，并且 iframe 第二次在那里，正确显示它的内容，那么为什么 javascript 没有拾取它呢？我试过等待几分钟，然后再次点击按钮，首先在 Div 2 中加载另一个页面，但它没有用。

我的解决方案是在 iframe-name 中添加时间，从而在每次加载时为其赋予唯一的名称。这很好用，现在即使在“取消”之后，javascript 也可以访问 iframe。

我的问题是：为什么在使用静态名称时，js第二次找不到iframe？

div 2 的内容是：

//THE FORM
<form id="myform" name="myform" class="myform" action="" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="" onkeypress="return keyCheck(event)">
// some form stuff
</form>
<iframe src='imbo/php/system_fotohidden.php' id='myframe' name='myframe'></iframe>

和javascript：

function click()
    var b=window.frames['myframe'];
    alert(b.name);
    

[编辑] 也许是为了澄清我在用 div 做什么：

点击 Div 1 中的“加载表单”按钮 Ajax 在 Div 2 中加载带有 Form 和 Iframe 的页面（显示效果很好） 使用 JS 访问 div 2 中的 Iframe => JS 找到 Iframe 并弹出它的名称 取消表单：JS => div2.innerhtml='' and div2.style.display='none' 点击 Div 1 中的“加载表单”按钮 Ajax 在 Div 2 中加载与 Form 和 Iframe 完全相同的页面（它仍然显示很好） 使用 JS 访问 div 2 中的 Iframe => JS 给出 NULL 而不是 Iframe-name

【问题讨论】：

什么是“空 [Div2]”？这可能是线索。你能粘贴一些代码吗？

在javascript中：div2.innerHTML="";

我猜你正在删除 IFRAME，所以它没有名称，因为它不再存在。要隐藏它，您可以使用DIV.style.visibility='hidden';

我还需要 Div2 来显示其他页面，因此不能选择隐藏。第二次在 Div2 中加载表单页面后，iframe 确实存在。我可以在 DOM 中看到它。它显示的所有内容都很好。只有javascript找不到了。

我不同意，如果你将 innerHTML 设置为 '' 你应该删除它的所有子元素。但现在我不确定。你有一个可行的例子吗？

【参考方案1】：

通过将元素innerHTML 属性设置为“”，您将删除其所有子元素，因此它们不再存在。您不能通过名称或document.frames 或其他任何方式引用它们。

要隐藏DIV 元素，您可以使用DIV.style.visibility='hidden';。

这是一个示例小提琴http://jsfiddle.net/ptFwE/1/；您可以看到div 的childNodes 属性表示在将innerHTML 设置为空字符串后DIV 中没有子项。

如果您需要此 div 用于其他目的，请考虑将 IFRAME 的 visibility 设置为仅 hidden 或使用其他 DIV。

【讨论】：

我知道这是在删除孩子。但是我在div中重新加载页面，这时候JS就找不到iframe了。

恐怕不能再帮你了。这可能是 Ajax 代码中的一些错误，可能页面不完全相同。但是，如果它是正确的，那么问题可能是您无法删除一个对象并创建具有相同名称的第二个对象，但这只是我的假设，我不相信。如果你看到这个 IFRAME，它就在你的 DOM 中，所以即使它没有名称或名称错误，你也应该能够通过 document.frames 访问它。如果是 DOM 问题，您也可以尝试使用其他浏览器进行测试。

无论如何。我找到了一个解决方案，所以它工作正常。只是很好奇会发生什么。