Javascript 如何使用java脚本访问其他HTML表单中的一个HTML表单元素？_Javascript_Html

Javascript 如何使用java脚本访问其他HTML表单中的一个HTML表单元素？

javascript html

Javascript 如何使用java脚本访问其他HTML表单中的一个HTML表单元素？,javascript,html,Javascript,Html,我有两个html页面，一个是parent.htm，另一个是child.html，我在parent.htm'中给了href，child.html，这里我必须访问child.html`中的parent.htm元素，这里是我的两个文件 parent.htm <!DOCTYPE html> <html> <body> <form> <input id=text1 type=text name="test2"> <a href="chi

我有两个html页面，一个是

parent.htm

，另一个是

child.html

，我在

parent.htm'中给了href
，child.html，这里我必须访问child.html`中的parent.htm元素，这里是我的两个文件
parent.htm
<!DOCTYPE html>
<html>


<body>
<form>
<input id=text1 type=text name="test2">
<a href="child.html" target="_self">Open kid</a>
</form>
</body>
</html>

<!DOCTYPE html>
<html>
  <body>
    <form method="GET" id="myform" action="child.html">
      <input id=text1 type=text name="test2">
      <a href="child.html" target="_self" onclick="document.getElementById('myform').submit();">Open kid</a>
    </form>
  </body>
</html>



child.html
<html>
<script type="text/javascript">
function parent(){
    //here i want to access values from parent.htm page, but does not work
var value = parent.getElementById('text1').value;
    var value2=top.getElementById('text1').value;
alert(value);
}
</script>
<body onload="parent()">
<form>
    </form>
</body>
</html>

<!DOCTYPE html>
<html>
<body onload="alert(window.location.toString().split('?')[1].split('=')[1])">

</body>
</html>


函数父函数（）{
//在这里，我想从parent.htm页面访问值，但不起作用
var value=parent.getElementById（'text1'）.value；
var value2=top.getElementById（'text1'）.value；
警报（值）；
}

提前感谢
您应该能够使用窗口。opener
获取对父窗口的引用
var parent = window.opener


我明白了——您不能通过javascript（AFAIK）从上一页访问DOM元素
这通常由HTTPPOST变量处理，通过一些后端过程将form variables集合传递给后续页面
或（如Moje所述）在一个新窗口中打开页面，这样您就可以通过窗口访问父窗口。opener
您应该能够使用窗口。opener
获取对父窗口的引用
var parent = window.opener


我明白了——您不能通过javascript（AFAIK）从上一页访问DOM元素
这通常由HTTPPOST变量处理，通过一些后端过程将form variables集合传递给后续页面
或（如Moje所述）在新窗口中打开页面，以便您可以使用窗口访问父级。打开者
首先更改以下内容：-
<a href="child.html" target="_self">Open kid</a>

首先更改以下内容：-
<a href="child.html" target="_self">Open kid</a>

我认为你做不到，至少你现在的努力是这样的
单击“Open kid”后，当前页面将替换为新页面，因此您无法访问该属性
您应该能够通过使用cookies、在url中传递所需的值或使用来绕过此问题。
我认为您无法做到这一点，至少您正在尝试的方式是这样
单击“Open kid”后，当前页面将替换为新页面，因此您无法访问该属性
您应该能够通过使用cookie、在url中传递所需的值或使用来解决这个问题。
可能最简单的方法就是通过cookie。它是一个存储在客户机上的小文本文件，可以跨页面保存值。如果未指定过期日期，则当用户关闭浏览器时，cookie将过期

编辑
您还可以通过单击链接使用Javascript提交表单。我认为是formname.submit（）-它允许您从表单post中读取值。（虽然这比仅仅阅读cookie要多一点工作）
如果你只传递一两个字段，我会使用cookie。更重要的是，你可能想考虑通过JavaScript提交表单。
 < P>也许最简单的方法是通过cookie来实现你想要的。它是一个存储在客户机上的小文本文件，可以跨页面保存值。如果未指定过期日期，则当用户关闭浏览器时，cookie将过期

编辑
您还可以通过单击链接使用Javascript提交表单。我认为是formname.submit（）-它允许您从表单post中读取值。（虽然这比仅仅阅读cookie要多一点工作）
如果你只传递一两个字段，我会使用cookie。更重要的是，您可能想考虑通过JavaScript提交表单。 < P>父。
<!DOCTYPE html>
<html>


<body>
<form>
<input id=text1 type=text name="test2">
<a href="child.html" target="_self">Open kid</a>
</form>
</body>
</html>

<!DOCTYPE html>
<html>
  <body>
    <form method="GET" id="myform" action="child.html">
      <input id=text1 type=text name="test2">
      <a href="child.html" target="_self" onclick="document.getElementById('myform').submit();">Open kid</a>
    </form>
  </body>
</html>



child.html
<html>
<script type="text/javascript">
function parent(){
    //here i want to access values from parent.htm page, but does not work
var value = parent.getElementById('text1').value;
    var value2=top.getElementById('text1').value;
alert(value);
}
</script>
<body onload="parent()">
<form>
    </form>
</body>
</html>

<!DOCTYPE html>
<html>
<body onload="alert(window.location.toString().split('?')[1].split('=')[1])">

</body>
</html>



可能包含一些输入错误，但我们的想法是通过GET提交表单给子级，然后在加载child.html后从window.location读取GET参数。
parent.htm
<!DOCTYPE html>
<html>


<body>
<form>
<input id=text1 type=text name="test2">
<a href="child.html" target="_self">Open kid</a>
</form>
</body>
</html>

<!DOCTYPE html>
<html>
  <body>
    <form method="GET" id="myform" action="child.html">
      <input id=text1 type=text name="test2">
      <a href="child.html" target="_self" onclick="document.getElementById('myform').submit();">Open kid</a>
    </form>
  </body>
</html>



child.html
<html>
<script type="text/javascript">
function parent(){
    //here i want to access values from parent.htm page, but does not work
var value = parent.getElementById('text1').value;
    var value2=top.getElementById('text1').value;
alert(value);
}
</script>
<body onload="parent()">
<form>
    </form>
</body>
</html>

<!DOCTYPE html>
<html>
<body onload="alert(window.location.toString().split('?')[1].split('=')[1])">

</body>
</html>



可能有一些打字错误，但我们的想法是通过GET向孩子提交表单，然后在加载child.html后从window.location读取GET参数。
检查这可能有助于您了解不能在客户端设置cookie并在第二页读取cookie的任何原因？要求是只使用JS@tim，您可以使用Javascript设置和读取cookie。单击链接时，您可以保存cookie，并在页面加载时将其读入第二页。@Tim感谢您的帮助检查这可能对您有帮助您不能在客户端上设置cookie并在第二页上读取cookie的任何原因？要求是只使用JS@Tim您可以使用Javascript设置和读取cookie。单击链接时，您可以保存cookie，并在页面加载时将其读入第二页。@Tim感谢您的帮助，但我不是使用“window.open（）”打开新窗口，只是href link@faust，但我不是使用“window.open（）”打开新窗口，只是href link@faustMy要求在同一页面中打开child.html@Moje@MaheshVarma您是否考虑过异步加载孩子的html UI并在隐藏家长的UI后显示它？我的要求是在同一页面中打开child.html@Moje@MaheshVarma您是否考虑过异步加载孩子的html UI和隐藏父用户界面后显示？好主意，下面是一个显示类似操作的示例。谢谢@ShadowWizard-我的示例代码相当脏，但我们不知道他将如何处理抓取的值。所以我只是做了一个丑陋的单行警告：）是的，这是一般的想法，我的小提琴包含了更通用的方法。好主意，这里展示了一个类似的动作。谢谢@ShadowWizard-我的示例代码相当脏，但我们不知道他将如何处理抓取的值。所以我只做了一行警告：）是的，这是一般的想法，我的小提琴包含了更通用的方法。