JS中showModalDialog 详细使用(转)
基本介绍：
showModalDialog() (IE 4+ 支持)
showModelessDialog() (IE 5+ 支持)
window.showModalDialog() 方法用来创建一个显示HTML内容的模态对话框。
window.showModelessDialog() 方法用来创建一个显示HTML内容的非模态对话框。
使用方法：
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
参数说明：
sURL -- 必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments -- 可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。
对话框通过 window.dialogArguments来取得传递进来的参数。
sFeatures -- 可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。 ----------------
1. dialogHeight: 对话框高度，不小于100px
2. dialogWidth: 对话框宽度。
3. dialogLeft: 离屏幕左的距离。
4. dialogTop: 离屏幕上的距离。
5. center: { yes | no | 1 | 0 } ： 是否居中，默认yes，但仍可以指定高度和宽度。
6. help: {yes | no | 1 | 0 }： 是否显示帮助按钮，默认yes。
7. resizable: {yes | no | 1 | 0 } [IE5+]： 是否可被改变大小。默认no。
8. status: {yes | no | 1 | 0 } [IE5+]： 是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
9. scroll: { yes | no | 1 | 0 | on | off }：是否显示滚动条。默认为yes。
下面几个属性是用在HTA中的，在一般的网页中一般不使用。
10. dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印预览时对话框是否隐藏。默认为no。
11. edge:{ sunken | raised }：指明对话框的边框样式。默认为raised。
12. unadorned:{ yes | no | 1 | 0 | on | off }：默认为no。
参数传递：1. 要想对话框传递参数，是通过vArguments来进行传递的。类型不限制，对于字符串类型，最大为4096个字符。也可以传递对象，例如： ------------------------------- parent.htm
<script>
var obj = new Object();
obj.name="51js";
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");
</script>
modal.htm
<script>
var obj = window.dialogArguments
alert("您传递的参数为：" + obj.name)
</script> -------------------------------
2.可以通过window.returnValue向打开对话框的窗口返回信息，当然也可以是对象。例如： ------------------------------
parent.htm <script>
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");
alert(str); </script>
modal.htm <script>
window.returnValue="http://homepage.yesky.com"; </script>
常见技巧：
一、怎样才让在showModalDialog和showModelessDialog的超连接不弹出新窗口？ 在被打开的网页里加上<base target="_self">就可以了。这句话一般是放在<head>之间的。
二、怎样才刷新showModalDialog和showModelessDialog里的内容？ 在showModalDialog和showModelessDialog里是不能按F5刷新的，又不能弹出菜单。这个只能依靠
javascript了，以下是相关代码：
<body onkeydown="if (event.keyCode==116){reload.click()}"> <a id="reload" href="filename.htm" style="display:none">reload...</a>
将filename.htm替换成网页的名字然后将它放到你打开的网页里，按F5就可以刷新了，注意，这个要
配合<base target="_self">使用，不然你按下F5会弹出新窗口的。
三、如何用javascript关掉showModalDialog(或showModelessDialog)打开的窗口。 <input type="button" value="关闭" onclick="window.close()"> 也要配合<base target="_self">，不然会打开一个新的IE窗口，然后再关掉的。
四、Math.random与showModalDialog。
当你设置的弹出网页固定时（如上面的"modal.htm"页面），ie很可能到临时文件区，下载上次产生的该页面(openPage.html),而没有重新加载，
对于动态加载的页面来说，这样往往产生误会，如没有及时更新数据，也就更不利于开发者测试。所以，你可以采用如下方式：
var strPage = “/medal.htm?random="+Math.random();
这样每次产生的strPage是不一样的，原因也就不言自明了。
下面举两个例子
一、返回一个字符串
首先是父页面有个按钮，用来打开Modal页面userList.aspx
function openWin() { str =window.showModalDialog("userList.aspx",window,"status:0;help:0;edge:sunken;dialogWidth=700px;dialogHeight=400px");
if(str!=undefined && typeof(str)!=undefined && str!="undefined" && str!="") { document.getElementById("txtuserid").value=str; }else { document.getElementById("txtuserid").value=""; } }
str就是子页面返回过来的数据，我们把它添加到父类的一个表单元素中
子页面
function getValue() {
var selectValue=$(":radio:checked").val(); window.returnValue=selectValue; window.close(); }
在这里我们把子页面里的值返回到父页面里就可以了，然后关闭页面就可以了
二、返回一个数据
父页面
function openWin() { array =window.showModalDialog("demo2.aspx",window,"status:0;help:0;edge:sunken;dialogWidth=700px;dialogHeight=400px;scroll:no"); document.getElementById("username").value=array[0]; document.getElementById("sex").value=array[0]; }
子页面
function getValue() { var array=new Array(); array[0]=document.getElementById("username").value; Array[1]=document.getElementById("sex").value; window.returnValue=array; window.close(); }
返回一个数组就可以了，如果用open打开的话，在搜狗或者360浏览器打开的是一个页面或者阻拦什么的
前段时间在后台使用JS的winodw.showModalDialog来查看静态页面内容，发现不能及时显示更新后的页面内容，用open打开有时也会出现这种问题
解决办法 window.showModalDialog(getUrl+"?Rnd="+Math.random(),"","dialogWidth:600px;dialogHeight:400px;help:no;scroll:yes;center:yes;status:no;"); 这样就不会有缓存了
JS中showModalDialog 详细使用(转)的更多相关文章
- JS中showModalDialog 详细使用
基本介绍: showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.showModalDialog() 方法用来创建一个 ...
- JS中showModalDialog 详细使用方法
基本介绍: showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.showModalDialog() 方法用来创建一个 ...
- js中showModalDialog的使用
基本介绍: showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) ...
- JS中Array详细用法
1.数组的创建 var name= new Array(); //创建一个数组 name[0]="zhangsan"; //给数组赋值 name[1]="lisi&q ...
- js中的json对象详细介绍
JSON一种简单的数据格式,比xml更轻巧,在JavaScript中处理JSON数据不需要任何特殊的API或工具包,下面为大家详细介绍下js中的json对象, 1.JSON(JavaScript Ob ...
- js中推断对象详细类型
大家可能知道js中推断对象类型能够用typeof来推断. 看以下的情况 <script> alert(typeof 1);//number alert(typeof "2&quo ...
- 简述JS中 appy 和 call 的详细用法
Apply 和 Call 两个老生常言的方法,使用过程的一些细节还是有很大的异同,具体使用情况可以参照下面例子详细回顾一下. 区别和详解:js中call()和apply()的用法 1.关于call() ...
- javaScript系列：js中获取时间new Date()详细介绍
var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)m ...
- js中获取时间new Date()详细介绍
var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)m ...
随机推荐
- STM32F0xx_看门狗（独立+窗口）配置详细过程
Ⅰ.概述 对于看门狗,我觉得做单片机或者嵌入式开发的人员来说并不陌生,今天总结STM32F0看门狗的功能,F0的看门狗有两种:独立和窗口看门狗. 今天提供两种看门狗的软件工程实例,供大家下载. 两种看 ...
- C,C++容易被忽略的问题
1.字符串数组,字符串指针可以直接输出 ]="I am a student"; cout<<s2<<endl; char *p="I am a s ...
- js-提前声明和new操作符理解
1.提前声明:声明变量后,js会把声明部分提前到作用域前面. var a=1; function aheadOfStatement(){ alert(a); var a=2; } 这段代码结果是und ...
- Swift计算文本宽高
iOS 8 开始可以配合 AutoLayout 自动估算文本的高度,但是当 Cell 比较复杂的时候,还会需要手动去计算.首先声明一个样式 var TextStyle : [String : NSOb ...
- 不靠谱的Paypal及海外网站
昨天因为报名参加某个比赛,需要用到Paypal付款,整整折腾了我一个小时.我先是使用自己的银行储蓄卡,到最后一步需要银行确认,提示我需要安装个插件才能输入密码.安装完插件后需要重启浏览器,整个流程又要 ...
- 【EF Code First】CodeFirst初始配置
1,在Nuget管理中下载EntityFramework 2,配置文件中添加数据库配置 <connectionStrings> <add name="DefaultConn ...
- Linux 文件与目录
文件描述符 在内核中,所有打开的文件都使用文件描述符(一个非负整数)标记.文件描述符的变化范围是0~OPEN_MAX – 1.早期的unix系统中,每个进程最多可以同时打开20个文件,就是说文件描述符 ...
- [转]linux中强大的screen命令
[转]linux中强大的screen命令 http://pythonorg.diandian.com/post/2012-01-05/40027464147 今天用SCREEN用点生了,有几个功能不知 ...
- Labview实现频率调制（FM）
Labview实现频率调制(FM) 频率调制的原理: 自己的实现为三角函数分解 根据这个公式在Labview中连线则可以得到最终的波形输出 实现效果 从频域图中可以看出,载波信号的频率被调制,原本为双 ...
- Java内部实现的观察者模式小记
假如Admin要观察User的工资变化,当User的工资增加或者减少时,都会引起Admin输出相应的信息. 定义观察者接口:MyObserver.java package cn.liuning.wat ...