Java中modal dialog,showModalDialog模态对话框的使用详解以及浏览器兼容
1.ModalDialog是什么?showModalDialog是jswindow对象的一个方法,和window.open一样都是打开一个新的页面。
区别是:showModalDialog打开子窗口后,父窗口就不能获取焦点了(也就是无法操作了)。
可以在子窗口中通过设置window.returnValue的值,让父窗口可以获取这个returnvalue.
2.一个例子1)主窗口main.html,
2)在主窗口中通过showModalDialog的方式打开子窗口sub.html
3)在子窗口中设置returnValue返回给主窗口使用
main.html
functionshowmodal()
{
varret=window.showModalDialog("sub.html?temp="+Math.random());
alert("subreturnvalueis"+ret);
}
sub.html
functionreturnMain()
{
window.returnValue="returnfromsub";
window.close();
}
特别说明:在main.html中showModalDialog的方法时,有使用到Math.random()的目的是避免缓存。
3.showModalDialog详细使用vReturnValue=window.showModalDialog(sURL[,vArguments][,sFeatures])
sURL
必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
dialogHeight对话框高度,不小于100px,IE4中dialogHeight和dialogWidth默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
dialogWidth:对话框宽度。
dialogLeft:距离桌面左的距离。
dialogTop:离桌面上的距离。
center:{yes|no|1|0}:窗口是否居中,默认yes,但仍可以指定高度和宽度。
help:{yes|no|1|0}:是否显示帮助按钮,默认yes。
resizable:{yes|no|1|0}[IE5+]:是否可被改变大小。默认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。
4.浏览器兼容但是并不是所有浏览器对兼容这样的用法。
在Chrome中运行上面的例子的话,父窗口可以任意获取焦点,效果和window.open一样,而且获取的returnVale也是undefined.
以下是各主流浏览器对此方法的支持状况。浏览器
是否支持
状态
IE9
○
Firefox13.0
○
safari5.1
○
chrome19.0
×
并不是模态对话框,而是open了一个新窗体
Opera12.0
×
什么也发生,连个窗体都不弹
如果有传入vArguments这个参数为window的话:
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,其他浏览器都没有问题
5.如何解决Chrome的兼容问题。方向是:设置window.opener.returnValue=""
main.html
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);
}
sub.html
function returnMain()
{
if(window.opener!=undefined)
{
window.opener.returnValue = "return from sub";
}else{
window.returnValue = "return from sub";
}
window.close();
}
这里是判断某些对象是否为defined来区分浏览器。当然,也可以判断浏览器的类型的方式进行
这里是借用了父窗口的returnValue来使用, 如果父窗口的returnValue也用其他用途是可以使用替换的方式进行了, as:
var oldValue = window.returnValue;
var newValue = showModalDialog()
window.returnValue = oldValue
6.需要特别注意的是,Chrome下的测试需要把html 文件放入到web server(Tomcat,...)下通过http url 访问测试。否则就不成功了。
Java中modal dialog,showModalDialog模态对话框的使用详解以及浏览器兼容相关推荐
- showModalDialog模态对话框的使用详解以及浏览器兼容
showModalDialog是jswindow对象的一个方法,和window.open一样都是打开一个新的页面.区别是:showModalDialog打开子窗口后,父窗口就不能获取焦点了(也就是无法 ...
- Java中print、printf、println的区别 详解
Java中print.printf.println的区别详解 printf主要是继承了C语言的printf的一些特性,可以进行格式化输出 print就是一般的标准输出,但是不换行 println和pr ...
- JAVA中的类和对象之this的详解
系列文章目录 第一章 JAVA中的类和对象之this的详解 目录 前言 一.为什么要有this引用 二.this的三种用法 1.this.成员变量 2.this.成员方法 3.this()调用其它的构 ...
- java中静态代码块的用法 static用法详解(转)
(一)java 静态代码块 静态方法区别 一般情况下,如果有些代码必须在项目启动的时候就执行的时候,需要使用静态代码块,这种代码是主动执行的;需要在项目启动的时候就初始化,在不创建对象的情况下,其他程 ...
- Java中继承、接口、多态的作用详解(纯理论)
一.继承.接口与多态的相关问题: 1. 继承的作用?好处?坏处? 继承:通过继承实现代码复用.Java中所有的类都是通过直接或间接地继程java.lang.Object类得到的.继承而得到的类称为子类 ...
- java中的关键字:this与super 大详解
文章目录 1.this 1.1. this是什么? 1.2 this调用对象中的属性.构造器和方法 2.super 2.1 super是什么? 2.2 super调用父类的属性.构造器.方法 3. t ...
- java切片_ java中一个极其强悍的新特性Stream详解(非常实用)
java8中有两个非常有名的改进,一个是Lambda表达式,一个是Stream.如果我们了解过函数式编程的话,都知道Stream真正把函数式编程的风格引入到了java中.这篇文章由简入繁逐步介绍Str ...
- java中静态代码块的用法 static用法详解
(一)java 静态代码块 静态方法区别 一般情况下,如果有些代码必须在项目启动的时候就执行的时候,需要使用静态代码块,这种代码是主动执行的;需要在项目启动的时候就初始化,在不创建对象的情况下,其他程 ...
- java中biglong_Java的long和bigint长度对比详解
Java 中Long的值大小比较 java.util.Lang 对象吧,而不是基本类型 long (注意大小写) Java中如果使用 == 双等于比较对象,等于比较的是两个对象的内存地址,也就是比较 ...
最新文章
- Boost之timer库
- phpeditor编写php_在php中使用CKEDITOR在线编辑器
- 避免图像去雾算法中让天空部分出现过增强的一种简易方法
- Spring Boot 实战 —— MyBatis(注解版)使用方法
- 怎么将ppt转为pdf?
- IIS上部署MVC网站,打开后ExtensionlessUrlHandler-Integrated-4.0解决方法
- 【最新合集】IDEA 快捷键整理
- php in_array 判断数组中是否存在此元素
- keil MDK编译器警告和错误详解(不定期更新)
- Linux系统--CentOS 7.6.1810 安装 nginx 1.16.0
- 「leetcode」654.最大二叉树(详解)
- 拓端tecdat|爬取微博用户行为数据语义分析数据挖掘报告
- linux服务网卡速率查看,linux下查看网卡速率
- 如何填报高考志愿2020流程图解和最全指南
- 幼儿园计算机认识键盘上课教案,认识键盘教案
- 工业B2B电商平台整合延伸工业供应链上下游,打造产业链闭环
- 智商一般学计算机,IQ最高的十大专业公布 智商不高慎选
- Qt调试器出现:the selected debugger may be inappropriate for the inferior的解决方案
- 安卓Android手机汽车租赁系统app毕业设计
- 拓嘉启远:关于拼多多搜索溢价,你了解多少