应用js在父子窗口间进行传值
日期：2014-05-16 浏览次数：20317 次
使用js在父子窗口间进行传值
我使用js在父子之间进行传值主要是通过在子窗口调用父窗口的方法来实现传值的目的。
parent.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<html>
? <head> jquery控制只能输入数字并关闭输入法和简单日历控件
??? <title>parent.html</title>
?? ?
??? <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
??? <meta http-equiv="description" content="this is my page">
??? <meta http-equiv="content-type" content="text/html; charset=UTF-8">
?? ?
??? <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
?? ?<script type="text/javascript">
?? ??? ?function openWin() {
?? ??? ??? ?var style = "width=300,height=400,location=no,directories=no,toolbar=no,status=no,menubar=no,resizable=no,scrollbars=no";
?? ??? ??? ?window.open("child.html","打开窗口传值",style);?? ??? ?
?? ??? ?}
?? ??? ?
?? ??? ?function setValue(name,hname) {
?? ??? ??? ?document.getElementById("name").value = name;
?? ??? ??? ?document.getElementById("hname").value = hname;
?? ??? ?}
?? ?</script>
? </head>
?
? <body>
??? name:<input type="text" id="name"/><a href="#" onclick="openWin()">请选择</a>
??? <input type="hidden" name="name" id="hname"/>
? </body>
</html>
<html>
? <head> jquery控制只能输入数字并关闭输入法和简单日历控件
??? <title>parent.html</title>
?? ?
??? <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
??? <meta http-equiv="description" content="this is my page">
??? <meta http-equiv="content-type" content="text/html; charset=UTF-8">
?? ?
??? <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
?? ?<script type="text/javascript">
?? ??? ?function openWin() {
?? ??? ??? ?var style = "width=300,height=400,location=no,directories=no,toolbar=no,status=no,menubar=no,resizable=no,scrollbars=no";
?? ??? ??? ?window.open("child.html","打开窗口传值",style);?? ??? ?
?? ??? ?}
?? ??? ?
?? ??? ?function setValue(name,hname) {
?? ??? ??? ?document.getElementById("name").value = name;
?? ??? ??? ?document.getElementById("hname").value = hname;
?? ??? ?}
?? ?</script>
? </head>
?
? <body>
??? name:<input type="text" id="name"/><a href="#" onclick="openWin()">请选择</a>
??? <input type="hidden" name="name" id="hname"/>
? </body>
</html>
child.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<html>
? <head>
??? <title>child.html</title>
?? ?
??? <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
??? <meta http-equiv="description" content="this is my page">
??? <meta http-equiv="content-type" content="text/html; charset=UTF-8">
?? ?
??? <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
?? ?<script type="text/javascript">
?? ??? ?function selectedThis(obj) {
?? ??? ??? ?var name = obj.value;
?? ??? ??? ?var hname = obj.id;
?? ??? ??? ?window.opener.setValue(name,hname);//调用父窗口的方法进行传值
?? ??? ??? ?window.opener = null;
?? ??? ??? ?window.close();
?? ??? ?}
?? ?</script>
? </head>
?
? <body>
??? 请选择名称：<br/>
??? <input type="radio" name="name" id="name1" value="名称1" onclick="selectedThis(this)"/>名称1
??? <input type="radio" name="name" id="name2" value="名称2" onclick="selectedThis(this)"/>名称2
??? <input type="radio" name="name" id="name3" value="名称3" onclick="selectedThis(this)"/>名称3
??? <br/>
??? <input type="radio" name="name" id="name4" value="名称4" onclick="selectedThis(this)"/>名称4
??? <input type="radio" name="name" id="name5" value="名称5" onclick="selectedThis(this)"/>名称5
??? <input type="radio" name="name" id="name6" value="名称6" onclick="selectedThis(this)"/>名称6
?? ?
? </body>
</html>
<html>
? <head>
??? <title>child.html</title>
?? ?
??? <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
??? <meta http-equiv="description" content="this is my page">
??? <meta http-equiv="content-type" content="text/html; charset=UTF-8">
?? ?
??? <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
?? ?<script type="text/javascript">
?? ??? ?function selectedThis(obj) {
?? ??? ??? ?var name = obj.value;
?? ??? ??? ?var hname = obj.id;
?? ??? ??? ?window.opener.setValue(name,hname);//调用父窗口的方法进行传值
?? ??? ??? ?window.opener = null;
?? ??? ??? ?window.close();
?? ??? ?}
?? ?</script>
? </head>
?
? <body>
??? 请选择名称：<br/>
??? <input type="radio" name="name" id="name1" value="名称1" onclick="selectedThis(this)"/>名称1
??? <input type="radio" name="name" id="name2" value="名称2" onclick="selectedThis(this)"/>名称2
??? <input type="radio" name="name" id="name3" value="名称3" onclick="selectedThis(this)"/>名称3
??? <br/>
??? <input type="radio" name="name" id="name4" value="名称4" onclick="selectedThis(this)"/>名称4
??? <input type="radio" name="name" id="name5" value="名称5" onclick="selectedThis(this)"/>名称5
??? <input type="radio" name="name" id="name6" value="名称6" onclick="selectedThis(this)"/>名称6
?? ?
? </body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
