window.showDialog()兼容性处理
ModalDialog 是什么？
showModalDialog 是js window对象的一个方法， 和window.open一样都是打开一个新的页面。
区别是： showModalDialog打开子窗口后，父窗口就不能获取焦点了（也就是无法操作了）。
可以在子窗口中通过设置 window.returnValue 的值，让父窗口可以获取这个return value.
一个例子
1)主窗口 main.html,
2)在主窗口中通过showModalDialog的方式打开子窗口sub.html
3)在子窗口中设置 returnValue返回给主窗口使用
main.html
[html] view plaincopy
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="oscar999">
</HEAD>
<script>
function showmodal()
{
var ret = window.showModalDialog("sub.html?temp="+Math.random());
alert("sub return value is "+ret);
}
</script>
<BODY>
<INPUT id=button1 type=button value="open sub" name=button1 onclick="showmodal();">
</BODY>
</HTML>
sub.html
[html] view plaincopy
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="oscar999">
</HEAD>
<script>
function returnMain()
{
window.returnValue = "return from sub";
window.close();
}
</script>
<BODY>
<INPUT id=button1 type=button value="return and close" name=button1 onclick="returnMain()">
</BODY>
</HTML>
特别说明： 在main.html中showModalDialog的方法时， 有使用到Math.random()的目的是避免缓存。
showModalDialog详细使用
vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
sURL
必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
dialogHeight 对话框高度，不小于100px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 距离桌面左的距离。
dialogTop: 离桌面上的距离。
center: {yes | no | 1 | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes。
resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改变大小。默认no。
status: {yes | no | 1 | 0 } ［IE5+］：是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。
还有几个属性是用在HTA中的，在一般的网页中一般不使用。
dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印预览时对话框是否隐藏。默认为no。
edge:{ sunken | raised }：指明对话框的边框样式。默认为raised。
unadorned:{ yes | no | 1 | 0 | on | off }：默认为no。
浏览器兼容
但是并不是所有浏览器对兼容这样的用法。
在Chrome中运行上面的例子的话， 父窗口可以任意获取焦点，效果和window.open一样， 而且获取的returnVale也是undefined.
以下是各主流浏览器对此方法的支持状况。
浏览器 是否支持 状态
IE9 ○
Firefox13.0 ○
safari5.1 ○
chrome19.0 × 并不是模态对话框，而是open了一个新窗体
Opera12.0 × 什么也发生，连个窗体都不弹
如果有传入vArguments这个参数为window的话：
[javascript] view plaincopy
var ret = window.showModalDialog("sub.html?temp="+Math.random(),window);
则在子窗口中，以下的值为：
浏览器 模态对话框 window.opener window.dialogArguments returnValue
IE9 ○ undefined [object Window] ○
Firefox13.0 ○ [objectWindow] [object Window] ○
safari5.1 ○ [objectWindow] [object Window] ○
chrome19.0 × [objectWindow] undefined ×
注意一下Firefox浏览器下，子窗体假如刷新的话window.dialogArguments照样会丢失，变成undefined。以上结果中我们可以看出返回值returnValue就只有chrome浏览器返回的是undefined，其他浏览器都没有问题
如何解决Chrome的兼容问题。
方向是： 设置window.opener.returnValue=""
main.html
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="oscar999">
</HEAD>
<script>
function showmodal()
{
var ret = window.showModalDialog("sub.html?temp="+Math.random(),window);
//for Chrome
if(ret==undefined)
{
ret = window.returnValue;
}
alert("sub return value is "+ret);
}
</script>
<BODY>
<INPUT id=button1 type=button value="open sub" name=button1 onclick="showmodal();">
</BODY>
</HTML>
sub.html
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="oscar999">
</HEAD>
<script>
function returnMain()
{
if(window.opener!=undefined)
{
window.opener.returnValue = "return from sub";
}else{
window.returnValue = "return from sub";
}
window.close();
}
</script>
<BODY>
<INPUT id=button1 type=button value="return and close" name=button1 onclick="returnMain()">
</BODY>
</HTML>
这里是判断某些对象是否为defined来区分浏览器。当然，也可以判断浏览器的类型的方式进行
http://blog.csdn.net/oscar999/article/details/8272798
这里是借用了父窗口的returnValue来使用， 如果父窗口的returnValue也用其他用途是可以使用替换的方式进行了， as：
var oldValue = window.returnValue;
var newValue = showModalDialog()
window.returnValue = oldValue
需要特别注意的是， Chrome下的测试需要把html 文件放入到web server(Tomcat,...)下通过http url 访问测试。否则就不成功了。
window.showDialog()兼容性处理的更多相关文章
- window.open和window.showdialog区别
open打开的窗口可以点击切换到其背后的父窗口,dialog的窗口无法点击切换到其背后的父窗口, 假如用window.opener或者parent等对象时,建议用open方法,不要用dialog,否则 ...
- wpf window set window的owner
[DllImport("user32.dll")] public static extern IntPtr GetAncestor(IntPtr hWnd, int f ...
- 关闭 Window 之后，无法设置 Visibility，也无法调用 Show、ShowDialogor 或 WindowInteropHelper.EnsureHandle。
参考网址: 1.WPF Tips: Window.ShowDialog()方法:Cannot set Visibility or call Show, ShowDialog, or WindowInt ...
- WPF：window设置单一开启
方法一: Window window = new Window();window.ShowDialog; 方法二: 设置一个判断窗口打开状态的全局控制变量 private bool i ...
- 2000条你应知的WPF小姿势 基础篇<78-81 Dialog/Location/WPF设备无关性>
在正文开始之前需要介绍一个人:Sean Sexton. 来自明尼苏达双城的软件工程师.最为出色的是他维护了两个博客:2,000ThingsYou Should Know About C# 和 2,00 ...
- JavaScript事件概览
JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...
- 【笔记】JS基础一
名词解释 ECMAScript 翻译器,解释器 DOM 文档对象模型 Document Object Model 例如 document BOM 浏览器对象模型 Browser Object Mode ...
- MVVM模式下弹出窗体
原地址:http://www.cnblogs.com/yk250/p/5773425.html 在mvvm模式下弹出窗体,有使用接口模式传入参数new一个对象的,还有的是继承于一个window,然后在 ...
- WPF+Caliburn.Micro 杂记
开发过程中的小问题总结 1DataGrid的Header里面给Checkbox绑定IsEnabled,绑不上去. 2由A页面跳转到B页面,再由B页面返回一个值 3DataGrid里面的行通过一个方法 ...
随机推荐
- android动画效果大全
动画类型 Android的animation由四种类型组成 Android动画模式 Animation主要有两种动画模式:一种是tweened animation(渐变动画 XML中 JavaCod ...
- Eclipse error：Access restriction
报错:Access restriction: The method decodeBuffer(String) from the type CharacterDecoder is not accessi ...
- （原）使用vectot的.end()报错：iterators incompatible
转载请注明出处: http://www.cnblogs.com/darkknightzh/p/5070672.html 参考网址: http://blog.csdn.net/yxnyxnyxnyxny ...
- JQuery阻止表单提交的方法总结 - 使用onsubmit()验证表单并阻止非法提交
方法1:<form onsubmit="javascript:confirm()"> 方法内返回false阻止表单提交 示例:代码检测textarea内填写的长度,未填 ...
- PHP PSR-2 代码风格规范 (中文版)
代码风格规范 本篇规范是 PSR-1 基本代码规范的继承与扩展. 本规范希望通过制定一系列规范化PHP代码的规则,以减少在浏览不同作者的代码时,因代码风格的不同而造成不便. 当多名程序员在多个项目中合 ...
- 一些常用Linux命令简记
1.重命名文件夹 mv xxx/ yyy/ 将xxx文件夹重命名为yyy(前提是当前目录没有yyy文件夹,否则就移进去了!) 2.数据盘重新挂载 一.# umount /mnt(卸载硬盘已挂载的mn ...
- php word转HTML
因为安装的的xampp不知道如何查看我的Apache版本是多少,就先把com.allow_dcom=true打开了,但是仍旧报错说找不到com类,然后就把下面的extension扩展添加到php.in ...
- Pet（hdu 4707 BFS）
Pet Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...
- 动态加载JS过程中如何判断JS加载完成
在正常的加载过程中,js文件的加载是同步的,也就是说在js加载的过程中,浏览器会阻塞接下来的内容的解析.这时候,动态加载便显得尤为重要了,由于它是异步加载,因此,它可以在后台自动下载,并不会妨碍其它内 ...
- RegexOptions枚举
在创建Regex类的实例时,构造函数的重载中有一个要求传入RegexOptions的一个枚举值,我相信这个枚举一定非常有用,否则不会要求在构造函数中传入.今天就来看一看这个枚举的作用. 我们干脆把代码 ...