Question

我正在处理一个包含2个iframe的简单页面。将文本输入到iframeA中，一旦在iframeB上单击按钮，我希望它显示来自iframeA的文本，但它只显示未定义。我觉得我很亲近，但似乎无法看到我做错了什么。两个iframe页面的代码都在下面。

--iframeA (ifr1.htm)
<html>
<head>
    <script type="text/javascript">
    var var_name = document.getElementById("textbox").value;
    </script>
<body>
<input type="text" name"textbox" id="textbox"/>
</body>
</html>


--iframeB (ifr2.htm)
<html>
<body>
    <script type="text/javascript">
    function f2(txt){
    var name2 = parent.ifr1.var_name;
    document.getElementById('div2').innerHTML = name2;
    }
    </script>
    <div id="div2"></div>
    <button onclick="f2('complete')"></button>
</body>
</html>

Answer 1

parent.ifr1.var_name;

我建议parent.frames.ifr1.var_name

它只显示未定义：

var var_name = document.getElementById("textbox").value;</script>
</script>
…
<input type="text" name"textbox" id="textbox"/>

当文档加载时，您只需将输入的值分配一次（我怀疑它实际上是works at all）。当您稍后输入任何内容时，var_name的值永远不会更改。

相反，您希望在单击按钮时获取值：

function f2(txt){
    var name2 = parent.frames.ifr1.document.getElementById("textbox").value;
    document.getElementById('div2').innerHTML = name2;
}

（您可以从ifr1.htm删除脚本）。或者，将其用于第一个iframe：

<html>
<head>
<body>
    <input type="text" name"textbox" id="textbox"/>
    <script type="text/javascript">
    var var_name;
    document.getElementById("textbox").onchange = function(e) {
         var_name = this.value;
    };
    </script>
</body>
</html>

结果将返回未定义

1 个答案: