<html>
<head>
<title>JS父子窗口</title>
<script>
function alterImg(){
var _uname=document.frm.uname.value;//获取表单中控件的值
var res =showModalDialog("JS模式对话框.html",_uname,"dialogwidth:300;dialogheight:300;");
/*JS模式对话框.html--模式对话框打开的页面
_uname--传递给子窗体xxx.html的参数,它是一个字符串类型
propert:对话框的属性设置,如对话框宽度,滚动等
res--模式对话框的返回值,即子窗体传递给父窗体的数据*/
if(res!=null) {
document.getElementById("image").src=res; //变量不能加引号,注意哪些加引号,哪些不加引号
}else {
document.getElementById("image").src="head/b1.bmp";
}
}
</script>
</head>
<body>
<center>
<form name="frm">
<table cellspacing="1px" width="400px" border="1px">
<caption>表格标题</caption>
<tr><th colspan="2">用户注册</th></tr>
<tr>
<td>用户名</td>
<td><input type="text" value="" name="uname"></td>
</tr>
<tr>
<td>头像</td>
<td>
<img id="image" src="head/b1.bmp">
<a href="javaScript:alterImg();">换一张</a>
</td>
</tr>
</table>
</form>
</center>
</body>
</html>
<html>
<head>
<title>JS模式对话框</title>
</head>
<script>
function init() {//获取用户名文本框的值
//在对话框页面中window.dialogArguments属性表示父窗体传递过来的参数
document.getElementById("sp").innerText=window.dialogArguments;//给span层添加普通文本
}
function sel(a) {//a指图片对象
a.border="2px";
}
function unsel(a) {
a.border="0px";
}
function ok(a) {
//window.returnValue属性表示子窗体准备返回给父窗体的返回值,在子窗体关闭后返回
window.returnValue=a.src;//window可以去掉
window.close();
}
</script>
<body οnlοad="init();">
<center>
<span id="sp"></span>头像
<table>
<tr>
<td>
<script>
for(var i=1;i<21;i++) {
document.write("<img src=head/b"+i+".bmp οnmοuseοver=se1(this) οnmοuseοut=unse1(this) οnclick=ok(this)>");
if(i%5==0) {
document.write("<br>");
}
}
</script>
</td>
</tr>
</table>
</center>
</body>
</html>