父窗体得到子窗体的值(三种方式)_form父窗体获取子窗体的控件值-优快云博客

本文链接：https://blog.youkuaiyun.com/abcjack145/article/details/5220778

本文介绍了一个使用JavaScript实现的父窗口与子窗口间的数据交互示例。通过打开新窗口并利用window.showModalDialog及window.opener等方法进行数据传递，展示了不同窗口间的通信方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

testParent.jsp

<%@page contentType="text/html;charset=UTF-8" language="java"%>
<html>
<head>
<title>

父窗体
</title>
<script type="text/javascript">
function setName(name){
document.getElementById('name').value=name;
}

function showmodal(){
var ret = window.showModalDialog("testChild.jsp",null,"dialogWidth:350px;dialogHeight:350px;help:no;status:no");
document.getElementById('name').value=ret;
}
</script>
</head>
<body>
<form action="" name="frm1">
姓名:<input type="text" name="name" id="name"/>

testChild.jsp

<%@page contentType="text/html;charset=UTF-8" language="java"%>
<html>
<head>
<title>

子窗体
</title>
<script type="text/javascript">
function putName(){
window.opener.document.getElementById('name').value = document.getElementById('name').value;
self.close();
}
function putName1(){
var dateWeTi = document.getElementById("name").value;
window.opener.setName(dateWeTi);
window.close();
}

function putName2(){
var dateWeTi = document.getElementById("name").value;
window.returnValue = dateWeTi;
window.close();
}
</script>
</head>
<body>
<form action="" name="frm1">
姓名:<input type="text" name="name" id="name"/>
<input type="button" value="putName()" onclick="putName();">
<input type="button" value="putName1()" onclick="putName1();">
<input type="button" value="putName2()" onclick="putName2();">
</form>
</body>
</html>