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 ...
随机推荐
- SRF之权限控制
框架目前提供url访问.菜单和页面元素的权限控制和数据权限,权限基于角色来分配,1个用户可以属于多个角色,权限项分模块.页面.操作3级别,其中模块.页面用于url和菜单的控制,操作是对页面元素的控制. ...
- flask-cors 实现跨域请求
安装:pip install -U flask-cors from flask import Flask from flask.ext.cors import CORS app = Flask(__n ...
- golang的nil
golang中什么样的类型可以赋值nil? 类型文档中有注定"uninitialized value is nil"的类型都可以赋值nil. golang的基本类型不能赋值nil: ...
- Node.js深受欢迎的六大原因
Node.js是一种后起的优秀服务器编程语言,它用来构建和运行Web应用,这和ASP.NET,Ruby on Rails或Spring框架做的工作是类似的.它使用JavaScript作为主要的开发语言 ...
- UITableView表视图以及重建机制
表视图UITableView 表视图UITableView,是IOS中最重要的视图,随处可见 表视图通常用来管理一组具有相同数据结构的数据 UITableView继承自UIScrollView,所 ...
- flask环境配置
1.首先要看装python环境,最好是python 2.7版本的: 2.安装easy_install,至今也不确定这个东西是怎么装的,我先下载了一个ez_setup,用命令“python ez_set ...
- SharePoint 2010 设置宽度1024px
在模板页中找到 s4-workspace,设置class=”s4-nosetwidth“,然后再设置宽度为1024px:如果要居中,设置style=“margin:0 auto” 这样也会有一个问题: ...
- MDI窗体 的再度思考
早在敲学生管理系统的时候,青山师哥就跟我说过 MDI 窗体 跟 子窗体的事情,当时只是简单的查询.小小的用了一下,没有太在意. 当再次面对着这个东西更深层的时候才想起师哥那句话.“好好研究一下这个东 ...
- js之变量和作用域
JS的变量和其他语言的变量有很大区别.JS变量时“松散型”的,决定它只是在特定时间用于保存特定的一个名字而已.由于不存在变量要保存何种数据类型,变量的值和其数据类型可以在脚本的生命周期内改变. JS两 ...
- 关于 Google Chrome 中的全屏模式和 APP 模式
前言:我一直在纠结这篇文章是否应该归类在「前段开发」的范围内,哈哈! 前段时间做了一个项目,涉及到一个要全屏模式去访问网页的需求,因为 Google Chrome 的效率不错,而且专门为 Chrome ...