JavaScript 弹出子窗体并返回结果到父窗体的实现代码
思路:用window.showModalDialog方法获取到弹出子窗体的引用,再在子页面用window.returnValue="***"来返回结果。
示例代码:(用jQuery简化实现)
父页面:parent.html
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>父页面</title>
<mce:scriptlanguage="javascript"><!--
functionshowmodal()
{
varstrReturn=window.showModalDialog("son.html",null,"dialogWidth:800px;dialogHeight:600px;help:no;status:no");
vars="您选择了:";
for(vari=0;i<strReturn.length;i++)
{
s+=strReturn[i]+",";
}
alert(s);
}
//--></mce:script>
</body>
</html>
子页面son.html
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>子窗体</title>
<mce:scripttype="text/javascript"src="jquery-1.4.2.min.js"mce_src="jquery-1.4.2.min.js"></mce:script>
<mce:scripttype="text/javascript"><!--
varresult;
$(function(){
$("#send").click(function(){
varresult=newArray();
$("[name=a]:checkbox:checked").each(function(){
result.push($(this).val());
});
window.returnValue=result;
window.close();
});
});
//--></mce:script>
</head>
<body>
<p>
<inputtype="checkbox"name="a"value="苹果"/>苹果
<inputtype="checkbox"name="a"value="橘子"/>橘子
<inputtype="checkbox"name="a"value="香蕉"/>香蕉
<INPUTtype="button"value="提交"id="send"/>
</p>
</body>
</html>
热门推荐
10 香港老妈结婚祝福语简短
11 毕业立体贺卡祝福语简短
12 简短新年年会祝福语
13 评论小品祝福语大全简短
14 恭喜师兄结婚祝福语简短
15 员工集体辞职祝福语简短
16 高中新生祝福语 简短
17 装修祝福语男生搞笑简短
18 生日开业蛋糕祝福语简短