IE的模态对话框里的问题还真是不少

来源：互联网发布：青少年机器人编程编辑：程序博客网时间：2024/05/22 10:57

    模态对话框(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>

function OpenDialog()

{

var dlg = window.showModalDialog('Callee.htm');

}

</script>

</body>

</html>

存为：Caller.htm

<html>

<head>

<title>Callee</title>

</head>

<body>

<tr>

<button onclick="GetData()" ID="Button1">Open Dialog

</button></td>

</tr>

</table>

function GetData()

{

var url = 'http://www.google.com';

__XmlHttpPool__.GetRemoteData(url, alert);

}

</script>

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

欢迎回复您的实验结果，同时也欢迎讨论模态窗口的其它问题及解决方法。