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 生日广州男生祝福语简短