HTML父子页面通信问题(showModalDialog)
1. showModalDialog参数说明
window.showModalDialog(URL, ARGS,Features)(在父窗口中调用打开新的窗口)
URL -- 必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
ARGS -- 可选参数,类型:变体。向窗口中传递参数。在子窗口中使用window.dialogArguments来取得传递进来的参数。
Features -- 可选参数,类型:字符串。设置打开窗口的外观属性(height,width等)
Features详细属性说明:
dialogHeight 对话框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 距离桌面左的距离。
dialogTop: 离桌面上的距离。
center: {yes | no | 1 | 0 }:窗口是否居中,默认yes,但仍可以指定高度和宽度。
help: {yes | no | 1 | 0 }:是否显示帮助按钮,默认yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改变大小。默认no。
status: {yes | no | 1 | 0 } [IE5+]:是否显示状态栏。默认为yes[ Modeless]或no [Modal]。
scroll:{ yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes。
2 使用例子
parent.html中js
var orderData={
orderCommet:orderCommet,
email:email,
pnumber:pnumber,
cellnumber:cellnumber,
ddetail:ddetail,
dCity:dCity,
sCity:sCity,
sdetail:sdetail,
pname:pname,
startDate:startDate,
leavetime:leavetime,
serviceType:serviceType,
driverUsernumber:driverUsernumber,
};
window.showModalDialog("orderInfo.html",orderData,"height=600,width=700");
子窗口orderInfo.html中使用
var args = window.dialogArguments;
$("#serviceType").html(args.serviceType);
$("#driverNumber").html(args.driverUsernumber);
$("#sCity").html(args.sCity);
$("#sDetail").html(args.sdetail);
$("#startDate").html(args.startDate);
$("#leavetime").html(args.leavetime);
$("#pname").html(args.pname);
$("#dCity").html(args.dCity);
$("#ddetail").html(args.ddetail);
$("#pnumber").html(args.pnumber);
$("#cellnumber").html(args.cellnumber);
$("#email").html(args.email);
$("#orderComment").html(args.orderCommet);
3.问题总结
1)直接使用window.open能打开新的窗口,使用window.opener能够在子窗口中访问父窗口中内容
2)使用showModalDialog按F5刷新不管用,需配合reload使用(onkeydown="if (event.keyCode==116){reload.click()} 给reload函 数中绑定页面,例如:<a id="reload" href="orderInfo.html" style="display:none">reload...</a>)
3)window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框,由于是对话框,因此它并没有一般用window.open()打 开的窗口的所有属性(区别于window.showModelessDialog)
4) 被打开后就会始终保持输入焦点。除非对话框被关闭,否则用户无法切换到主窗口。类似alert的运行效果。
HTML父子页面通信问题(showModalDialog)的更多相关文章
- iframe之父子页面通信
iframe之父子页面通信 1.获取 子页面 的 window 对象 在父页面中,存在如下两个对象 window.frames document.iframeElement.contentWindo ...
- iframe父子页面通信
一.同域下父子页面的通信 1.父页面调用子iframe页面 (1)通过iframe的Id获取子页面的dom,然后通过内置属性contentWindow取得子窗口的window对象,此方法兼容各个浏览器 ...
- js之iframe子页面与父页面通信
iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...
- js之iframe父、子页面通信
注意事项 一 . 页面加载顺序:一般先加载完父页面才会去加载子页面,所以:必须要确保在iframe加载完成后再进行操作,如果iframe还未加载完成就开始调用里面的方法或变量,会产生错误.判断ifra ...
- 【JavsScript】父子页面之间跨域通信的方法
由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...
- 【JavaScript】父子页面之间跨域通信的方法
由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...
- iframe子页面与父页面通信
同域下父子页面的通信 父页面: <!DOCTYPE html> <html> <head lang="en"> <meta charset ...
- asp.net中父子页面通过gridview中的按钮事件进行回传值的问题
这两天写BS程序,遇到父子页面传值的问题,以前没写过web系统,用了几天时间才将问题解决,总结下记录下来: 问题描述: 父页面A中有一个gridview,每行6个列,有5列中均有一个按钮,单击按钮,会 ...
- JavaScript 父子页面相互调用总结
父子页面相互调用是一个在开发中经常遇到的问题,但是没有找到过比较全面的文章介绍.在此总结下来,供大家参考. 四种方式 一般情况下,我们可以使用iframe.window的open.showModalD ...
随机推荐
- [转] 不要被C++“自动生成”所蒙骗
http://www.cnblogs.com/fanzhidongyzby/archive/2013/01/12/2858040.html C++对象可以使用两种方式进行创建:构造函数和复制构造函数. ...
- checkbox 删除
先创建del.php文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...
- python 全栈开发之路 day1
python 全栈开发之路 day1 本节内容 计算机发展介绍 计算机硬件组成 计算机基本原理 计算机 计算机(computer)俗称电脑,是一种用于高速计算的电子计算机器,可以进行数值计算,又可 ...
- Python之路,Day13-----暂无正在更新中
Python之路,Day13-----暂无正在更新中
- Android 发送验证码 简易代码
效果 Activity ;//倒计时 private Timer timer; private Handler handler = new Handler() { public void handle ...
- Traceview 性能分析工具
简介 TraceView 是 Android 平台配备一个很好的性能分析的工具.它可以通过图形化的方式让我们了解我们要跟踪的程序的性能,并且能具体到 method.详细内容参考:http://deve ...
- Android Studio 使用GitHub
Android Studio 使用GitHub 1.安装配置 默认大家都已经安装了git软件,参考下图进行git与as关联 配置git 设置GitHub用户信息 填写完用户名,密码后可以点击Tes ...
- SASS详解之沿袭(extend)
SASS详解之继承(extend) 每一个类名都有可能有另一个类名的所有样式和它自己的特定样式的.当一个div的身上有两个类名,一个是“one”,另一个是“two”的时候.如下 HTML代码 < ...
- Python 函数的使用 外加引入文件
#coding=utf-8 #!user/bin/python import sys import test2 def functionsss(name,sex,age=25): print name ...
- java_reflect_01
最近学习java开始接触到了框架,突然觉得java反射很重要,因此在这里做了一些总结(参考园中大苞米大神的文章) 首先我们要认识一下Class: 一.Class类有什么用? class类的实例表示ja ...