哈哈哈,简单的讲了一下课:
***壹***
父子窗口传值,用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>密 码:</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>密 码</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>密 码</td><td><input type="text" id="password2"></td></tr>
<tr><td><input type="button" value="点我子向父传" οnclick="qqq()"></td></tr>
</table>
</body>
</html>