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)的更多相关文章

  1. iframe之父子页面通信

    iframe之父子页面通信 1.获取 子页面 的 window 对象  在父页面中,存在如下两个对象 window.frames document.iframeElement.contentWindo ...

  2. iframe父子页面通信

    一.同域下父子页面的通信 1.父页面调用子iframe页面 (1)通过iframe的Id获取子页面的dom,然后通过内置属性contentWindow取得子窗口的window对象,此方法兼容各个浏览器 ...

  3. js之iframe子页面与父页面通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

  4. js之iframe父、子页面通信

    注意事项 一 . 页面加载顺序:一般先加载完父页面才会去加载子页面,所以:必须要确保在iframe加载完成后再进行操作,如果iframe还未加载完成就开始调用里面的方法或变量,会产生错误.判断ifra ...

  5. 【JavsScript】父子页面之间跨域通信的方法

    由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...

  6. 【JavaScript】父子页面之间跨域通信的方法

    由于同源策略的限制,JavaScript跨域的问题,一直是一个比较棘手的问题,为了解决页面之间的跨域通信,大家煞费苦心,研究了各种跨域方案.之前也有小网同学分享过一篇“跨域,不再纠结” 开始照着尝试时 ...

  7. iframe子页面与父页面通信

    同域下父子页面的通信 父页面: <!DOCTYPE html> <html> <head lang="en"> <meta charset ...

  8. asp.net中父子页面通过gridview中的按钮事件进行回传值的问题

    这两天写BS程序,遇到父子页面传值的问题,以前没写过web系统,用了几天时间才将问题解决,总结下记录下来: 问题描述: 父页面A中有一个gridview,每行6个列,有5列中均有一个按钮,单击按钮,会 ...

  9. JavaScript 父子页面相互调用总结

    父子页面相互调用是一个在开发中经常遇到的问题,但是没有找到过比较全面的文章介绍.在此总结下来,供大家参考. 四种方式 一般情况下,我们可以使用iframe.window的open.showModalD ...

随机推荐

  1. Qt 学习之路 :Qt 模块简介

    Qt 5 与 Qt 4 最大的一个区别之一是底层架构有了修改.Qt 5 引入了模块化的概念,将众多功能细分到几个模块之中.Qt 4 也有模块的概念,但是是一种很粗的划分,而 Qt 5 则更加细化.本节 ...

  2. 再回首,Java温故知新——开篇说明

    不知不觉在IT界从业2年了,两年时间足够一个人成长很多,当然也会改变很多事.在这两年时间里,随着对技术的深入了解,知识面的拓展以及工作难度的增大,渐渐的感觉自己技术方面根基不稳,多数问题也只是做到知其 ...

  3. [转] doxygen使用总结

    doxygen [功能] 为许多种语言编写的程序生成文档的工具. [举例] *生成一个模板配置文件,模板文件中有详细的注释: $doxgen -g test 这样,会生成一个test文件,1500多行 ...

  4. TCP的封包与拆包

    对于基于TCP开发的通讯程序,有个很重要的问题需要解决,就是封包和拆包. 一.为什么基于TCP的通讯程序需要进行封包和拆包. TCP是个"流"协议,所谓流,就是没有界限的一串数据. ...

  5. 初步学习vue.js

    vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API. 响应的数据绑定 Vue.js 的核心是一个响应的数据绑定系统,它让数据与 DOM 保持同 ...

  6. Linux shell入门基础(四)

    四.进程优先级前台后台 01.进程控制 #find /name aaa & #ps aux | grep find #updatedb &  #ps aux | grep update ...

  7. android背景平铺方式 tileMode

    创建重复的背景图片  在drawable目录下创建一个repeat_bg.xml:    然后在布局的xml文件中可以这样引用:    ================================ ...

  8. 016--JLE JNG(小于等于)

    一.指令格式 条件转移指令 JLE/JNG 格式: JLE/JNG 标号地址 功能: 小于等于/不大于  时转到标号地址 JNG    有符号 不大于         则跳转    //Jump if ...

  9. JavaScript ArrayBuffer浅析

    时隔一年半,再次来到博客园.回首刚接触前端时所写的两篇随笔,无法直视啊~ --------------------------------------------------------------- ...

  10. JavaScript回调函数的理解

    这里是个人对回调函数的一段理解 <!DOCTYPE html> <html> <head> <title>回调函数</title> < ...