重新加载后javascript找不到iframe

Question

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

我有一个包含两个分层 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 做什么：

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

Answer 1

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

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

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

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