分享JS父页面与子页面相互传值方法

发布时间：2023-10-23 14:48:21 所属栏目：教程来源：

导读：一、子页面是父页面通过window.open弹出的情况

子页面要向父页面传值，只要在document前面加window.opener即可。

如：

1.父页面代码：

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

一、子页面是父页面通过window.open弹出的情况

子页面要向父页面传值，只要在document前面加window.opener即可。

如：

1.父页面代码：

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档title>

head>

<script language="javascript">

function tanchu()

{

    window.open("Untitled-5.html");

}

script>

<body>

    <form id="form1" name="form1" method="post" action="">

        <label> <input type="submit" name="button" id="button" value="提交"

            onclick="tanchu()" />

        label> <label> <input type="text" name="textfield" id="textfield" />

        label>

    form>

</body>

</html>

2.子页面代码：

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档title>

head>

<script language="javascript">

function aaa()

{

    window.opener.document.getElementByIdx('textfield').value='123123123';

}

script>

<body>

    <form id="form1" name="form1" method="post" action="">

        <label> <input type="submit" name="button" id="button" value="提交"

            onclick="aaa()" />

        label>

    form>

</body>

</html>

二、子页面是iframe框架中的页面情况

子页面要向父页面传值，只要在document前面加parent即可。

1.父页面代码：

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档title>

head>

<body>

    <form id="form1" name="form1" method="post" action="">

        <label> <input type="text" name="textfield" id="textfield" />

        label>

        <iframe id="myiframe" src="Untitled-3.html">iframe>

    form>

</body>

</html>

2.子页面代码

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档title>

head>

<script language="javascript">

function aa()

{

    var a=parent.document.getElementByIdx('textfield').value;

（编辑：聊城站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!