js 父子窗口——showModalDialog()、showModelessDialog()方法的使用(1)

JavaScript技巧:使用showModalDialog和showModelessDialog 对话框中的网页可以通过window.dialogArguments属性访问传递给它的参数,对话框可以通过window.returnValue属性设置返回值,并通过window.close方法关闭对话框。对话框中的网页可以通过window.dialogArguments属性访问传递给它的参数,对话框可以通过window.opener属性访问打开它的窗口对象,并通过window.close方法关闭对话框。在上述示例中,我们创建了一个计算器对话框,用户可以在对话框中进行简单的计算操作。 阅读详情

基本介绍:
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,IE4中dialogHeight   和   dialogWidth   默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用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。
下面几个属性是用在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://www.51js.com ";
  </script> 

用window.showModalDialog 或者window.showModelessDialog打开一个模式窗口后,和父窗口的一些交互问题。
要进行交互操作的前提,在调用showModalDialog或者showModelessDialog方法的时候,第二个参数传window,如:


window.showModelessDialog('filename.htm',window,'dialogWidth=200px;dialogHeight=250px;')

接下来,就是取得父窗口的一些数据和方法,这是经常会用的,父窗口取子窗口的参数一般通过returnValue就可以搞定了~


//取得父窗口的JS变量 var
window.dialogArguments.var;
//获得父窗口的对象和属性
window.dialogArguments.form1.name.value ;
//调用父窗口的方法 fun
window.dialogArguments.fun() ;


但是有个问题,在子窗口中的事件响应无法调用父窗口的方法,


<button onClick='window.dialogArguments.fun()'>调父窗口方法</button>

注,执行上面的方法的时候,窗口会停止响应

JavaScript常用的窗口函数(showModalDialog,open,confirm) NULL 博文链接:https://hongan.iteye.com/blog/287050 立即下载

相关推荐

window.showModalDialog()返回值的学习心得总结

下面先说说window.showModalDialog的基本用法 showModalDialog() (IE 4+ 支持)showModelessDialog() (IE 5+ 支持)window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框。window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。 使用方法:vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])vReturnValue = window.showModeles

showModalDialog()、showModelessDialog()方法使用详解

Javascript有许多内建的方法来产生对话框,如:window.alert(), window.confirm(),window.prompt().等。 然而IE提供更多的方法支持对话框。如:  showModalDialog() (IE 4+ 支持)  showModelessDialog() (IE 5+ 支持) window.showModalDialog()方法用来创建一个显示HTML

一杯咖啡 2483

LTR-390UV-01对比VEML6075:5个真实项目中的选型避坑指南

本文对比了LTR-390UV-01和VEML6075两款环境光传感器在5个真实项目中的表现,提供了选型避坑指南。通过智能手环、农业温室、紫外线消毒柜等场景的实测数据,分析了动态范围、抗干扰性、温度稳定性等关键差异,帮助开发者在成本与性能间做出最优选择。

weixin_28733777的博客 220

JS中showModalDialog的详细用法

window.showModalDialog("url","name","参数:值;参数:值;……")  url:对话框窗口链接地址  name:对话框的名称,可以为空  scroll:是否有滚动条,0表示无,非0表示有  status:是否有状态栏,0表示无,非0表示有  help:是否有问号,0表示无,非0表示有  resizable:是否可以用鼠标拖动改变框提大小,0表示不可以,

sunhongyezi的专栏 852

免费搞定DWG转DXF:ODA File Converter保姆级配置指南(附常见报错解决)

本文详细介绍了如何使用ODA File Converter免费工具实现DWG到DXF的格式转换,包括环境配置、命令行参数解析、编程集成方案及常见问题解决。特别针对网络访问异常、参数配置等实际痛点提供应对策略,帮助用户高效完成工程设计文件的格式转换。

weixin_29291185的博客 6015

GD32F303实战:用定时器4触发ADC2+DMA,实现10ms精准采样1024点的完整流程

本文详细介绍了在GD32F303微控制器上使用Timer4触发ADC2配合DMA传输,实现10ms精准采样1024点的完整方案。从硬件架构设计、时钟树配置到定时器参数计算,提供了完整的工程实现流程和常见问题排查方法,适用于工业传感器监测等高实时性场景。

weixin_29194693的博客 433

JS中ShowModalDialog(模态窗口)详细使用

基本介绍:           showModalDialog()         (IE 4+ 支持)           showModelessDialog()      (IE 5+ 支持)           window.showModalDialog()                  方法用来创建一个显示HTML内容的模态对话框。           window.sho

tuobayi的博客 7万+

RT-Thread新手必看:FMT飞控移植中的5个常见坑及解决方案

本文针对RT-Thread新手在移植FMT开源飞控时遇到的5大核心挑战,提供了深度解决方案。内容涵盖SCons构建系统配置、RT-Thread版本API兼容性处理、BSP与设备驱动适配、TOML系统配置解析以及算法模块集成调试,帮助开发者高效避坑,成功完成飞控移植。

gin88的博客 250

.JS 模式窗口showModalDialog()、showModelessDialog()

1.用showModalDialog()   <!-- showModalDialog( 'http://www.fwcn.com ', 'example04 ', 'dialogWidth:400px;dialogHeight:300px;dialogLeft:200px;dialogTop:150px;center:yes;help:yes;resizable:yes;status:

程序人生的专栏 1万+

Flowable第一篇、快速上手(Flowable安装、配置、集成)

Flowable是一个轻量级、高效可扩展的工作流和业务流程管理(BPM)引擎,支持在Java应用程序中实现复杂的工作流自动化。Flowable最初是作为Activiti项目的一个分支发展而来的,但它现在已经成为一个独立的开源项目,并在企业级应用中得到了广泛使用

Du_XiaoNan的博客 1万+

PCB激光直接成像(LDI)设备技术解析与优化方案

激光直接成像(LDI)是PCB制造中的关键数字化工艺,通过激光束直接在基板上形成电路图案。其核心技术在于高精度光学系统与智能控制算法的结合,工作精度可达微米级。在HDI板、柔性电路等高端PCB制造中,LDI技术能显著提升线宽精度和层间对位准确性。当前行业面临材料适配性、热变形控制等挑战,动态能量补偿、多波长曝光等创新方案正在突破这些瓶颈。随着模块化设计、预测性维护等工程实践的普及,LDI设备综合效率持续提升,为5G、汽车电子等领域的精密电路生产提供关键技术支撑。

weixin_29168393的博客 392

大灰狼的Javascript工具箱(四)——showModalDialog()、showModelessDialog()方法使用详解

现在越来越多的浏览器会屏蔽掉 window.open() 这个让程序员大为头痛。有办法解决吗?看看这个文章或许对你有帮助!showModalDialog()、showModelessDialog()方法使用详解 Javascript有许多内建的方法来产生对话框,如:window.alert(), window.confirm(),window.prompt().等。 然而IE提供更多的方法支持对话

大灰狼的专栏 2349

Figma做原型设计一篇教会你,全栈软件开发必备技能,前后端岗位锐减找工作的底牌

本文介绍了使用Figma进行前端应用原型设计的方法与优势。Figma作为主流设计工具,能够满足大多数应用系统的原型设计需求,强调系统设计应保持简洁合理。文章详细说明了Figma的基本操作流程,包括创建Frame页面、组件使用、交互设置等核心功能,并指出命名规范的重要性。同时对比了Axure、墨刀等其他设计工具的特点,建议根据具体需求选择合适的平台。最后强调原型设计主要关注交互功能展示,业务逻辑应通过需求文档表述。整体而言,Figma凭借其简洁高效的特点,已成为原型设计的优选工具。

有问题或资源连接有缺失的可以私信公众号新潮看世界获取 460

showModalDialog和showModelessDialog使用心得

showModalDialog和showModelessDialog使用心得一、showModalDialog和showModelessDialog有什么不同?  showModalDialog:被打开后就会始终保持输入焦点。除非对话框被关闭,否则用户无法切换到主窗口。类似alert的运行效果。  showModelessDialog:被打开后,用户可以随机切换输入焦点。对主窗口没有任何影响(

轻灵自由的珍珠 3170

Vue3 - 完美解决高德地图定位失败 Get ipLocation failed.Geolocation permission denied.(获取ipLocation失败。地理定位权限被拒绝。)

Get ipLocation failed.Geolocation permission denied.,vue3引入高德地图当前定位失败 ,vue3中使用高德地图定位报错,高德地图API用户定位失败,高德地图H5 定位失败报错排查和解决方案,微信公众号H5网页高德地图定位报错,谷歌浏览器-高德地图定位失败geolocation,getCurrentPosition 返回的 message报错,如何解决此问题,uniapp h5高德地图,微信、QQ等内置浏览器定位失败,高德地图实现实时用户位置定位,引入高德

🏆 前端领域优质创作者 4171

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

js 父子窗口——showModalDialog()、showModelessDialog()方法的使用(2)

window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框,由于是对话框,因此它并没有一般用window.open()打开的窗口的所有属性。 window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。

739

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

javascript中showModalDialog和showModelessDialog区别

javascript中showModalDialog和showModelessDialog区别 1. showModalDialog和showModelessDialog的异同 同:两者弹出的窗体不能刷新 异:前者是模态窗口,始终获得焦点;后者是非模态窗口,只不过弹出一个页面,还可以操作父窗口。 2. 关闭showModalDialog和showModele...

weixin_30546189的博客 348

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

上一篇: jsp中跳转 jsp的两种跳转方式及区别
下一篇: js 父子窗口——showModalDialog()、showModelessDialog()方法的使用(2)
BenjaminP
博客等级 码龄15年 1粉丝 8原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值