模态对话框(Modal Dialog),是一种会block顺序执行程序的窗口,比如C#里的MessageBox.Show(this,...),JavaScript里的alert(...)、confirm(...)等,是我们最常见的模态对话框。不关闭这种对话框程序的当前线程就被一直挂起了,这种窗口的特性最适合用来做条件分支的判断提示和Wizard窗口。
模态对话框(Modal Dialog),是一种会block顺序执行程序的窗口,比如C#里的MessageBox.Show(this,...),JavaScript里的alert(...)、confirm(...)等,是我们最常见的模态对话框。不关闭这种对话框程序的当前线程就被一直挂起了,这种窗口的特性最适合用来做条件分支的判断提示和Wizard窗口。
在IE里面,我们可以通过window对象的showModalDialog方法十分方便的开启一个模态对话框。可是这个从IE4.0就开始支持的feature,居然还有一堆一堆的问题:( 比如:点超级链接或Submit按钮会开启新窗口啊,不能使用F5刷新啊,拿不到模态窗口的opener啊,等等。不过这些老问题绕来绕去都还算是被解决了。剩下的什么怎么在模态窗口间传出传入参数啊,怎么执行其opener里的方法啊,怎么关闭啊,就属于没有好好看msdn和对DHTML的不熟悉了。
今天一不小心又发现一个模态对话框让人抓狂的问题,不能在里面使用XMLHTTP对象获取服务器数据,一调用就立刻返回空字符串。搞了半天找不到原因,于是啰里啰唆的把模态对话框的父窗口传到对话框内,把调用XMLHTTP对象的程序从模态窗口里原样移到父窗口里,从模态窗口去调父窗口里的方法,结果一下就取到服务器上的数据了
。到这里我还以为找到模态对话框的bug了,回家后决定把这个bug再研究一下,结果却很顺利的从模态窗口里调用XMLHTTP对象获得了服务器上的数据
。真是郁闷!!!
明天再找个机器来试试,看看到底还有没有问题。
如果你对JS也感兴趣,不妨也来试验一下,看看到底是我机器环境本身的原因,还是这是一个不确定的bug。
测试代码如下:
<html>
<head>
<title>Caller</title>
</head>
<body>
<button onclick="OpenDialog()">Open Dialog
</button>

<script language="javascript">
function OpenDialog()

{
var dlg = window.showModalDialog('Callee.htm');
}
</script>
</body>
</html>
存为:Caller.htm
<html>
<head>
<title>Callee</title>
</head>
<body>
<table border="0" width="100%" height="100%">
<tr>
<td align="center" valign="middle">
<button onclick="GetData()" ID="Button1">Open Dialog
</button></td>
</tr>
</table>

<script language="javascript">
function GetData()

{
var url = 'http://www.google.com';
__XmlHttpPool__.GetRemoteData(url, alert);
}
</script>

<script language="javascript">
var __XmlHttpPool__ =

{
m_MaxPoolLength : 10,
m_XmlHttpPool : [],
__requestObject : function()

{
var xmlhttp = null;
var pool = this.m_XmlHttpPool;
for ( var i=0 ; i < pool.length ; ++i )

{
if ( pool[i].readyState == 4 || pool[i].readyState == 0 )

{
xmlhttp = pool[i];
break;
}
}
if ( xmlhttp == null )

{
return this.__extendPool();
}
return xmlhttp;
},
__extendPool : function()

{
if ( this.m_XmlHttpPool.length < this.m_MaxPoolLength )

{
var xmlhttp = null;
try

{
xmlhttp = new ActiveXObject('MSXML2.XMLHTTP');
}
catch(e)

{
try

{
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}

catch(e2)
{}
}
if ( xmlhttp )

{
this.m_XmlHttpPool.push(xmlhttp);
}
return xmlhttp;
}
},
GetRemoteData : function(url, callback)

{
return this.__receiveRemoteData(url, callback, 'GET', null);
},
PostRemoteData : function(url, callback, data)

{
return this.__receiveRemoteData(url, callback, 'POST');
},
__receiveRemoteData : function(url, callback, httpmethod, data)

{
var xmlhttp = this.__requestObject();
if ( !xmlhttp )

{
return null;
}
xmlhttp.open(httpmethod, url, true);
xmlhttp.onreadystatechange = function()

{
if ( xmlhttp.readyState == 4 || xmlhttp.readyState == 'complete' )

{
callback(xmlhttp.responseText);
}
};
xmlhttp.send(data);
return xmlhttp;
}
};
</script>
</body>
</html>
存为:Callee.htm
欢迎回复您的实验结果,同时也欢迎讨论模态窗口的其它问题及解决方法。