父子窗口传值

哈哈哈,简单的讲了一下课:

***壹***

父子窗口传值,用window.open()

父窗口:
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>父子窗口传值</title>
<script type="text/javascript">
    
function chuan(){

var w= window.open ('D:/JAVA/dw/js/jsweb/js第五讲父子窗口传值/zi.html','_blank','width=600,height=400,top=100,left=500,menubar=no,toolbar=nostatus=no,scrollbars=yes');
    
}

</script>
</head>


<body>
<form>
<table>
<tr><td>用户名:</td><td><input type="text" id="user" name="user"> </td></tr>
<tr><td>密&nbsp;&nbsp;&nbsp;码:</td><td><input type="password" id="password" name="password"></td></tr>
<tr><td><input type="button" value="点我" onClick="chuan();"> </td><td><input type='reset' value="重置" > </td></tr>
</table>
</form>
</body>

</html>

子窗口:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>子窗口及子窗口向父传值</title>
<script type="text/javascript">
window.onload=function (){//网页打开就加载函数
huoqu()
};
function huoqu(){
//window.opener.document.getElementById("user").value代表父窗口用户名输入框里的值
//document.getElementById("user2").value代表子窗口用户名输入框里的值
//等号左边代表参数,右边代表值
document.getElementById("user2").value=window.opener.document.getElementById("user").value;
document.getElementById("password2").value=window.opener.document.getElementById("password").value;


function rrr(){

var user2=document.getElementById("user2").value;
var password2=document.getElementById("password2").value;
window.opener.document.getElementById("user").value=user2;
window.opener.document.getElementById("password").value=password2;
window.close();


}
</script>
</head>


<body>


用户名为<input type="text" id="user2" name="user2"><br/>
密码为<input type="text" id="password2" name="password2">


<input type="button" value="返回" οnclick="rrr();">


</body>
</html>

***贰***

模态窗口window.showModalDialog()

父页:motai.html



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>模态窗口传值</title>
<script type="text/javascript"> 
function xx(){
var name=document.getElementById("user").value;
var password=document.getElementById("password").value;
var w=window.showModalDialog("D:/JAVA/dw/js/jsweb/js第六讲模态窗口传值/zi.html",name+"#"+password);      //模态窗口括号里逗号前面是子窗口页面或url,逗号后面是传的参数,参数与参数之间用“#”隔开


 if (w != 0) { //从子窗口返回的值不为0即有值时
 var aaa=w.split("#"); //拆分返回值
 document.getElementById("user").value=aaa[0];//aaa[0]第一个参数
document.getElementById("password").value=aaa[1]; //aaa[1]第二个参数
    }  
}


</script>




</head>


<body>
<table>
<tr><td>用户名</td><td><input type="text" id="user"></td></tr>
<tr><td>密&nbsp;&nbsp;&nbsp;码</td><td><input type="text" id="password"></td></tr>
<tr><td><input type="button" value="点我" οnclick="xx();"></td></tr>
</table>


</body>
</html>

子页:zi.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
var zhi=window.dialogArguments;//这是全局变量,接收父窗口传过来的参数
     

function aa(){
       var b=zhi.split("#");//分拆传过来的参数
       document.getElementById("user2").value=b[0];
       document.getElementById("password2").value=b[1];
}


function qqq(){
var name=document.getElementById("user2").value;
var mima=document.getElementById("password2").value;
window.returnValue=name+"#"+mima;//window.returnvalue表示的是返回到父窗口的值
close();
}
</script>




</head>


<body οnlοad="aa();">//body里面的onload表示网页打开时就加载


<table>
<tr><td>用户名</td><td><input type="text" id="user2"></td></tr>
<tr><td>密&nbsp;&nbsp;&nbsp;码</td><td><input type="text" id="password2"></td></tr>
<tr><td><input type="button" value="点我子向父传" οnclick="qqq()"></td></tr>
</table>
</body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值