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和jQuery随意改变div属性style的名称和值
Oct 22 Javascript
javascript与Python快速排序实例对比
Aug 10 Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
Mar 11 Javascript
前端框架Vue.js中Directive知识详解
Sep 12 Javascript
浅析BootStrap Treeview的简单使用
Oct 12 Javascript
vue 实现 tomato timer(蕃茄钟)实例讲解
Jul 24 Javascript
tangram.js库实现js类的方式实例分析
Jan 06 Javascript
详解使用 Node.js 开发简单的脚手架工具
Jun 08 Javascript
Vue表单控件绑定图文详解
Feb 11 Javascript
Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能详解
Dec 07 Javascript
JS实现表单中点击小眼睛显示隐藏密码框中的密码
Apr 13 Javascript
Vue项目配置跨域访问和代理proxy设置方式
Sep 08 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
杏林同学录(二)
2006/10/09 PHP
PHP中isset与array_key_exists的区别实例分析
2015/06/02 PHP
php生成酷炫的四个字符验证码
2016/04/22 PHP
PHP实现SMTP邮件的发送实例
2018/09/27 PHP
PHP结合Redis+MySQL实现冷热数据交换应用案例详解
2019/07/09 PHP
Package.js  现代化的JavaScript项目make工具
2012/05/23 Javascript
javascript学习笔记(十二) RegExp类型介绍
2012/06/20 Javascript
jQuery动画效果-slideUp slideDown上下滑动示例代码
2013/08/28 Javascript
javascript设置金额样式转换保留两位小数示例代码
2013/12/04 Javascript
Jquery解析json数据详解
2013/12/26 Javascript
基于JS实现横线提示输入验证码随验证码输入消失(js验证码的实现)
2016/10/27 Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
2016/10/27 Javascript
Vue.JS入门教程之自定义指令
2016/12/08 Javascript
详解jQuery uploadify文件上传插件的使用方法
2016/12/16 Javascript
js数组与字符串常用方法总结
2017/01/13 Javascript
jquery将标签元素的高设为屏幕的百分比
2017/04/19 jQuery
JS+canvas动态绘制饼图的方法示例
2017/09/12 Javascript
ionic使用angularjs表单验证(模板验证)
2018/12/12 Javascript
VueQuillEditor富文本上传图片(非base64)
2020/06/03 Javascript
Python使用代理抓取网站图片(多线程)
2014/03/14 Python
python实现K最近邻算法
2018/01/29 Python
selenium跳过webdriver检测并模拟登录淘宝
2019/06/12 Python
Python Selenium 之数据驱动测试的实现
2019/08/01 Python
elasticsearch python 查询的两种方法
2019/08/04 Python
Python3常用内置方法代码实例
2019/11/18 Python
Python 类的魔法属性用法实例分析
2019/11/21 Python
tensorflow实现残差网络方式(mnist数据集)
2020/05/26 Python
CSS3 优势以及网页设计师如何使用CSS3技术
2009/07/29 HTML / CSS
一款基于css3的动画按钮代码教程
2014/11/23 HTML / CSS
岗位职责范本
2013/11/23 职场文书
手机被没收检讨书
2014/02/22 职场文书
2014公司年终工作总结
2014/12/19 职场文书
敬业奉献模范事迹材料
2014/12/24 职场文书
小班上学期个人总结
2015/02/12 职场文书
活动经费申请报告
2015/05/15 职场文书
人民币符号
2022/02/17 杂记