js模态对话框showModalDialog与非模态对话框showModelessDialog

 

在js中要用到弹出框是很常见的事，一般我们只是弹出个警告，提示，用alert就可以了；

如果涉及到输入值，可能要用到confirm，prompt。

但是这还不够，如果弹出的页面需要是一个定制的页面，即弹出y一个html，那怎么办呢？

一般，大家很快想到window.open，是吧？

但是这个函数有个问题，我想让弹出的页面是一个新的窗口，悬浮在原先的页面上。

这个函数是做不到的，现在的浏览器很多页面时想选项卡一样打开的，用这个函数打开的页面会和其他

选项卡并列打开，而并不是你想要的打开一个新的浏览器窗口。

有人说，只要设置浏览器打开页面方式不要在tab选项卡打开就可以了，这也是一个办法，

但是你怎么跟客户解释呢？

貌似实现哪种想要的效果只能换另一种方式了，就是弹出层。

弹出层的原理很简单，就是事先在页面写一个隐藏的div，当弹出时，让它显示即可。

至于让它悬浮在页面上，很容易做到，控制css就可以了。

很多这样的js框架也是这个原理，比如jquery-ui。

你甚至不用自己写代码，到网上找找就能找到很漂亮可用的弹出层代码。

 

貌似这是最完美的解决办法了，其实这样的代码是有问题的。

这样的弹出层是基于一个页面的，因为你先写好的隐藏div就放在某个页面，

当这个页面又被放到其他frame中去的时候，那弹出的div其实还在原先的页面，而没有悬浮在

frame的外面，效果就是你看到的弹出框悬浮在嵌入的frame里面，这样你就必须保证弹出的div大小不能超过

frame的大小，不然就卡在里面了，而且即使div大小没有超过frame，div的移动范围也没法移出frame边框。

这样的效果可以说就是一个大bug！页面的bug是很严重的，因为客户直接可以看到。

所以这种方式是有局限性的，除非你的页面没有用到frame，这个页面就是一个html。

或者你的某个页面足够大，不用考虑会被卡在里面。

 

现在我想说另外一种办法，就是ie有模态对话框showModalDialog与非模态对话框showModelessDialog

 （注：