WEB页子窗口(showModalDialog和showModelessDialog)使用说明


Posted in Javascript onOctober 25, 2009

使用环境:

showModalDialog

IE4以上版本

showModelessDialog

IE5以上
区别:

showModalDialog

被打开后就会始终保持输入焦点。无法操作主窗口,除非关闭对话框。

showModelessDialog

被打开后,用户可以随机切换输入焦点。只是主窗口被对话框挡住。
使用方法:

vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])

vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
参数说明:

sURL

必选参数,类型:字符串。用来指定对话框要显示的文档的URL。

vArguments

可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。

sURLsFeatures

可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。

1.dialogHeight 对话框高度,不小于100px,IE4中dialogHeight和dialogWidth 默认的单位是em,而IE5中是px

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。

10. dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。

11. edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。

12. unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。
例子:
f.html

<html> 
<head> 
<title>主窗口</title> 
<script type="text/javascript"> 
<!-- 
var child; 
function openDialogBox() 
{ 
child = window.showModalDialog('c.html',document.all["txt"],"dialogWidth=500px;dialogHeight=200px;"); 
} 
//--> 
</script> 
</head> 
<body> 
<input name="txt" type="text" disabled="disabled" /> 
<input name="btn" type="button" value="打开对话框" onClick="openDialogBox();" /> 
</body> 
</html>

c.html
<html> 
<head> 
<title>对话框</title> 
<script type="text/javascript"> 
<!-- 
function set() 
{ 
window.dialogArguments.value=document.all["txt"].value 
} 
//--> 
</script> 
</head> 
<body> 
<input name="txt" type="text"/> 
<input name="btn" type="button" value="设置" onClick="set();" /> 
</body> 
</html>
Javascript 相关文章推荐
JS获取IUSR_机器名和IWAM_机器名帐号的密码
Dec 06 Javascript
JavaScript Memoization 让函数也有记忆功能
Oct 27 Javascript
Jquery中children与find之间的区别详细解析
Nov 29 Javascript
javascript框架设计之类工厂
Jun 23 Javascript
Javascript实现图片懒加载插件的方法
Oct 20 Javascript
JQuery页面随滚动条动态加载效果的简单实现(推荐)
Feb 08 Javascript
JavaScript在控件上添加倒计时功能的实现代码
Jul 04 Javascript
JS实现瀑布流布局
Oct 21 Javascript
关于vue单文件中引用路径的处理方法
Jan 08 Javascript
Vue组件中slot的用法
Jan 30 Javascript
js计算最大公约数和最小公倍数代码实例
Sep 11 Javascript
详解node.js 事件循环
Jul 22 Javascript
JavaScript弹簧振子超简洁版 完全符合能量守恒,胡克定理
Oct 25 #Javascript
javascript window对象属性整理
Oct 24 #Javascript
Javascript 模式实例 观察者模式
Oct 24 #Javascript
Jquery 弹出层插件实现代码
Oct 24 #Javascript
js 操作符实例代码
Oct 24 #Javascript
利用JQuery+EasyDrag 实现弹出可拖动的Div,同时向Div传值,然后返回Div选中的值
Oct 24 #Javascript
JS window.opener返回父页面的应用
Oct 24 #Javascript
You might like
长波有什么东西
2021/03/01 无线电
Mysql的常用命令
2006/10/09 PHP
PHP更安全的密码加密机制Bcrypt详解
2017/06/18 PHP
PHP在同一域名下两个不同的项目做独立登录机制详解
2017/09/22 PHP
PHP与Perl之间知识点区别整理
2019/03/19 PHP
JavaScript与Image加载事件(onload)、加载状态(complete)
2011/02/14 Javascript
Ajax异步提交表单数据的说明及方法实例
2013/06/22 Javascript
JS取request值以及自动执行使用示例
2014/02/24 Javascript
js返回上一页并刷新的多种实现方法
2014/02/26 Javascript
JavaScript字符串对象replace方法实例(用于字符串替换或正则替换)
2014/10/16 Javascript
javascript:void(0)点击登录没反应怎么解决
2015/11/13 Javascript
JS原型对象的创建方法详解
2016/06/16 Javascript
浅谈node的事件机制
2017/10/09 Javascript
vue如何在自定义组件中使用v-model
2018/05/14 Javascript
JS实现动态生成html table表格的方法分析
2018/07/11 Javascript
node.js 模块和其下载资源的镜像设置的方法
2018/09/06 Javascript
element-ui上传一张图片后隐藏上传按钮功能
2019/05/22 Javascript
详解Vue3 Teleport 的实践及原理
2020/12/02 Vue.js
python写xml文件的操作实例
2014/10/05 Python
跟老齐学Python之重回函数
2014/10/10 Python
Python使用shelve模块实现简单数据存储的方法
2015/05/20 Python
解决python升级引起的pip执行错误的问题
2018/06/12 Python
Python实现App自动签到领取积分功能
2018/09/29 Python
python matplotlib饼状图参数及用法解析
2019/11/04 Python
django修改models重建数据库的操作
2020/03/31 Python
Python实现进度条和时间预估的示例代码
2020/06/02 Python
css3 中的新特性加强记忆详解
2016/04/16 HTML / CSS
全球最受追捧的运动服品牌领先数字目的地:Stylerunner
2020/11/25 全球购物
既然说Ruby中一切都是对象,那么Ruby中类也是对象吗
2013/01/26 面试题
英文自荐信
2013/12/19 职场文书
中学生打架检讨书
2014/02/10 职场文书
销售团队口号大全
2014/06/06 职场文书
本科生求职信
2014/06/17 职场文书
居委会四风问题个人对照检查材料
2014/09/25 职场文书
购房协议书范本
2014/10/02 职场文书
Spring Boot DevTools 全局配置学习指南
2022/03/31 Java/Android