以前为了浏览器的兼容性，在开发时从未使用过 window.showModalDialog ，从 FF3 开始已经支持 window.showModalDialog （FF2不支持此方法），GOOGLE的浏览器也是支持的（非模式窗体，与open方法打开的窗体一样），今天研究了一下具体的使用方法，如下：
【注意】
在IE下，弹出的模式窗体中，如果存在表单，则在提交表单时，会自动弹出一个 新的窗口。
解决方法：
在 <head> </head>中增加如下标签即可
<base target="_self" />
【父窗体 1.html 】
<html>
<head>
<title>ParentWindow</title>
<script>
var a = new Array;
a[0] = 1;
a[1] = 4;
dialogwidth = 450;
dialogheight = 300;
function openModal()
{
dialogleft = ( window.screen.width - dialogwidth ) / 2;
dialogtop = ( window.screen.height - dialogheight ) / 2;
//document.getElementById('foo').innerHTML = "HELLO";
var r = window.showModalDialog('2.html',
window.self, // 此参数可为任意类型 window.self 可使子窗体具备操作父窗体的功能
"center:0; dialogleft:"+ dialogleft +"px;dialogtop: "+ dialogtop +"px; dialog "+ dialogwidth +"px; dialogheight: "+ dialogheight +"px; resizable: yes; scroll: yes;");
//alert(r);
if(r==null || r=="undefined"){ // 判断是否异常关闭（点击窗体“关闭”按钮）
document.getElementById('foo').innerHTML = "NULL";
}else{
document.getElementById('foo').innerHTML = r;
// window.location.reload(true); // 刷新窗体
}
//alert(dialogwidth);
}
// 在子窗体中调用此函数
function parentFunc(param){
//alert(param); // firefox 中加入此句后，模式窗口将不再起作用（即可点击操作父窗体）
document.getElementById('foo').innerHTML = param;
}
</script>
</head>
<body>
<input type="button" value="Open modal dialog" onclick="openModal();">
<div>
<p>Modal dialog return value:</p>
<p id="foo">
</div>
</body>
</html>
【模式窗体 2.html 】
<html>
<head>
<title>ModalDialog</title>
<script type="text/javascript" src="http://blog.163.com/shihua_23/blog/1.js"></script>
</head>
<body>
<input id="foo" type="text" value="Dialog value...">
<input type="button" value="Close" onclick="closeModalDialog();">
<a href="http://blog.163.com/shihua_23/blog/safe.html">link</a>
</body>
</html>
【js 代码 1.js 】
document.write("Modal dialog got argument: " + window.dialogArguments);
//alert(window.dialogArguments); // 获得参数。注意：在 firefox 中，点击 F5 刷新模式窗体后，此参数将丢失，IE下不会丢失
//alert(window.dialogArguments.dialogwidth);
//window.dialogArguments.dialogwidth = 1000; // 给父窗体中全局变量赋值
window.dialogArguments.parentFunc(window.dialogArguments.dialogwidth); // 调用父窗体函数
//window.dialogArguments.location.reload(true); // 刷新父窗体
function closeModalDialog(){
//alert(window.dialogArguments);
window.returnValue = document.getElementById('foo').value; // window.returnValue 为模式窗体的返回值
window.close();
}
特别注意：
在FF3中，不能将 1.js 的代码放在 2.html 中，例如：
<html>
<head>
<title>ModalDialog</title>
<script type="text/javascript" >
document.write("Modal dialog got argument: " + window.dialogArguments);
//alert(window.dialogArguments); // 获得参数。注意：在 firefox 中，点击 F5 刷新模式窗体后，此参数将丢失，IE下不会丢失
//alert(window.dialogArguments.dialogwidth);
//window.dialogArguments.dialogwidth = 1000; // 给父窗体中全局变量赋值
window.dialogArguments.parentFunc(window.dialogArguments.dialogwidth); // 调用父窗体函数
//window.dialogArguments.location.reload(true); // 刷新父窗体
function closeModalDialog(){
//alert(window.dialogArguments);
window.returnValue = document.getElementById('foo').value; // window.returnValue 为模式窗体的返回值
window.close();
}
</script>
</head>
<body>
<input id="foo" type="text" value="Dialog value...">
<input type="button" value="Close" onclick="closeModalDialog();">
<a href="http://blog.163.com/shihua_23/blog/safe.html">link</a>
</body>
</html>
理由：在 FF3 中，这样写会导致 模式窗体自动刷新一次，从而使的 window.dialogArguments 变量重置为null（FF3不支持模式窗体的F5刷新）