|
项目中不止一次用到showModalDialog模态窗口,刚开始也没在意,当再次使用时总会出现些问题，特此做个总结。
父页面:parent.jsp
<input type="button" onclick="winshow()" />
<script type="text/javascript">
function winshow(){
window.showModalDialog("son.jsp",window,"sFeatures");//window表示把父窗口对象传到子窗口,子窗口用window.dialogArguments可得到传进来的对象
//sFeatures 可选 字符串 用来描述对话框的外观等信息
//sFeatures参数说明 参数名称 参数属性 说明
//dialogHeight npx 对话框高度，不小于100px //dialogWidth npx 对话框宽度 //dialogLeft npx 离主窗口左的距离 //dialogTop npx 离主窗口上的距离 //center {yes | no | 1 | 0 } 窗口是否居中，默认yes //help {yes | no | 1 | 0 } 是否显示帮助按钮，默认yes //resizable {yes | no | 1 | 0 } 是否可改变大小，默认no //status {yes | no | 1 | 0 } 是否显示状态栏，默认为yes[ Modeless]或no[Modal] //dialogHide { yes | no | 1 | 0 | on | off } 在打印或者打印预览时对话框是否隐藏，默认为no //scroll { yes | no | 1 | 0 | on | off } 指明对话框是否显示滚动条，默认为yes //edge { sunken | raised } 指明对话框的边框样式，默认为raised //unadorned { yes | no | 1 | 0 | on | off } 默认为no //注意：dialogHide，edge，unadorned这三个属性是用在HTA（HTML Aplication）中的，一般网页上用不到。 }
</script>
子页面:son.jsp
<form action="" >
<input type="button" onclick="doSubmit()" />
</form>
<script type="text/javascript">
function doSubmit(){
document.form[0].action="xxx.do";
document.form[0].submit();
}
</script>
//注意：如果此时子页面这样写的话，子页面中点击按钮后会弹出一个新窗口，为避免这样，可以在子页面的<head></head>标签中加入
<base target="_self" />
方法二:如果不想像上面那样，可以在父窗口中加入如下代码
<iframe name="myframe" style="display:none" />
同时子页面中的表单要写成<form action="" target= "myframe">这样才行。
方法三:子页面还可以写成如下
<input type="button" onclick="doSubmit()" />
<script type="text/javascript">
function doSubmit(){
var win=window.dialogArguments;
window.close();
win.form[0].action="xxx.do"?+子页面要传的参数;
win.form[0].submit();
}
</script>
方法四:
父页面如下:
<input type="button" onclick="winshow()" />
<script type="text/javascript">
function winshow(){
var win=window.showModalDialog("son.jsp",window,"");//此时得到的win就是子页面返回的值
}
</script>
子页面:
<input type="button" onclick="doSubmit()" />
<script type="text/javascript">
function doSubmit(){
var test=document.getElementByID("test");
window.returnValue=test;
}
</script>
|
|
|
