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 ...
随机推荐
- 关于js中this的疑问
学习bootstrap.js源码中被js里边的this绕的有点晕 /* ================================================================ ...
- ldd3-2 构造和运行模块：环境搭建2
之前搭建了Ubuntu10.04驱动开发环境,但是那儿的内核版本是2.6.32.27,总感觉无从下手的感觉,因为书上的内核版本是2.6.10,作为初学者不知道差异在哪里,或许不应该纠结这个问题吧. 昨 ...
- 线性结构CT 02-线性结构1 一元多项式的乘法与加法运算
设计函数分别求两个一元多项式的乘积与和. 输入格式: 输入分2行,每行分别先给出多项式非零项的个数,再以指数递降方式输入一个多项式非零项系数和指数(绝对值均为不超过1000的整数).数字间以空格分隔. ...
- STM32F0xx_FLASH编程（片内）配置详细过程
Ⅰ.概述 关于数据的储存,我觉得编程的人基本上都会使用到,只是看你储存在哪里.STM32的芯片内部FLASH都是可以进行编程的,也就是说可以拿来储存数据.但是,很多做一些小应用程序开发的人都没有利用好 ...
- 第六节：宿主如何使用AppDomain
前面已经讨论了宿主以及宿主加载CLR的方式.同时还讨论了宿主如何告诉CLR创建和卸载AppDomain.为了使这些讨论更加具体,下面将描述一些常见的宿主和AppDomain使用情形.特别地,我要解释不 ...
- 2.html5的基本格式
分享完html语言的核心之后,是时候开始写了.理论上,只要符合格式要求,就算是用记事本也可以写.但是,这种蛋疼且生产力低下的行为还是少做的好,选一个适合自己的IDE才是上上之选,至于哪个合适自己,那就 ...
- windows下python+flask环境配置详细图文教程
本帖是本人在安装配置python和flask环境时所用到的资源下载及相关的教程进行了整理罗列,来方便后面的人员,省去搜索的时间.如果你在安装配置是存在问题可留言给我. 首先罗列一下python+fla ...
- UIView的创建与内存管理
学习过程中遇到一些问题,现在记录下来,以后忘记以便翻看. 创建工程的步骤: xcode的ARC改为MRC .h文件中的strong改为retain .m文件中加入dealloc方法 .m文件中_win ...
- flask页面中Head标签内容为空问题
在使用flask时遇到点问题,以前还没有注意到. 生成页面的时候使用的是模板继承方式,当添加meta标题的时候,本来是添加的base.html模板中的head标签中,但是生成页面后,head中的内容却 ...
- homework-02 二维的，好喝的（二维数组的各种子数组）
1)输入部分 对于输入部分,我定义的输入格式是这样的 前两行为列数和行数 如果文件无法打开,或者输入文件格式不对,均会提示出错并退出 2)二维数组的最大矩形子数组 首先,我使用最最简单的暴力算法,直接 ...