父页面bootstrap模态框:

<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="false" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<iframe style="zoom: 0.8;" height="700px" src="" frameBorder="0" width="99.6%"></iframe>
</div><!-- /.modal-content -->
</div><!-- /.modal -->
</div>

父页面js代码 :增加message监听器

function openModal(){
$('iframe').attr("src","http://localhost:8080/test/corsPage.html");
$('#myModal').modal({backdrop:false});//false:表示单击模态框以外区域不关闭模态框
}
window.addEventListener('message', receiveMessage, false);
function receiveMessage(evt) {
var taskData = $.parseJSON(evt.data);
if(taskData.opt=="C"){
$("#myModal").modal("hide");
}
}

子页面corsPage.html,跨域/单独的页面(iframe打开,跟父页面无关),
如何关闭模态框/传值给父页面, JS代码:

var data_ = {"opt":"C"};//Close/Hide modal
window.parent.postMessage(JSON.stringify(data_), '*');

Bootstrap 模态框 + iframe > 打开子页面 > 数据传输/关闭模态框的更多相关文章

  1. BootStrap母版页布局.子页面布局.BootstrapTable.模态框.警告框.html导出tabl生成Excel.HTML生成柱图.饼图.时间控件中文版

    如上就是很多后台管理系统的母版页布局. 左边一列模板.上面一列系统标识. 空白处充填子页面 以ASP.NET MVC为基础 引入bootstrap.js.bootstrap.css body: < ...

  2. 打开子页面及刷新父页面 window.open window.opener.reload()

    //打开子页面 var url=children_url;window.open(url) //刷新parent页面 var url=parent_urlfunction refresh(url){  ...

  3. iframe中在父窗口打开子页面

    我们在做页面框架的时候,通常会采用一个iframe来显示子页面,但有这么种情况,就是session失效时,登录页面就会显示在iframe中,这不符合常理,一般应该显示在顶部才对. 下面的js代码可以解 ...

  4. 主页面获取iframe 的子页面方法。

    父页面parent.html <html> <head> <script type="text/javascript"> function sa ...

  5. 使用iframe框架后的页面跳转时目标页面变为iframe的子页面的问题

    <frameset rows="4,200,10,*,120" cols="*" framespacing="0" framebord ...

  6. js-关于iframe:从子页面给父页面的控件赋值方法

    项目中我们经会用到iframe,可能还会把iframe里的数值赋值给父页面空间. 接下来我们来说说有关于iframe赋值给父页面的方法. 1.子页面iframe给父页面的控件赋值方法. parent. ...

  7. window.open 打开子窗口,关闭所有的子窗口

    需求:通过window.open方法打开了子窗口,当关闭主窗口时,子窗口应当也关闭. 实现思路: 1.打开子窗口函数window.open(url,winName)的第二个参数winName可以唯一标 ...

  8. HTML子页面保存关闭并刷新父页面

    1.思路是子页面保存后,后台传递成功的js到前台. 2.js的原理是——子页面调用父页面的刷新 子页面 function Refresh() {            window.parent.Re ...

  9. iframe访问子页面方法

    在Iframe中调用子页面的Js函数 调用IFRAME子页面的JS函数 说明:假设有2个页面,index.html和inner.html.其中index.html中有一个iframe,这个iframe ...

随机推荐

  1. 通过SQL Server 2008数据库复制实现数据库同步备份

    SQL Server 2008数据库复制是通过发布/订阅的机制进行多台服务器之间的数据同步,我们把它用于数据库的同步备份.这里的同步备份指的是备份服务器与主服务器进行 实时数据同步,正常情况下只使用主 ...

  2. 两个shell脚本

    脚本1停止lampp #!/bin/bash #set -xv 开启调试模式? count=`ps -ef|grep lampp|grep -v "grep"|wc -l`  # ...

  3. JS Json数据转换

    *** json字符串中不能出现单引号,不然JSON.parse会报错,处理方式将单引号转义 概述 JSON.stringify() 方法可以将任意的 JavaScript 值序列化成 JSON 字符 ...

  4. sql server之数据库语句优化

    三.只返回需要的数据 返回数据到客户端至少需要数据库提取数据.网络传输数据.客户端接收数据以及客户端处理数据等环节,如果返回不需要的数据,就会增加服务器.网络和客户端的无效劳动,其害处是显而易见的,避 ...

  5. EMIF接口的寻址问题

    2014年8月26日,一个网友提出了一个关于EMIF访问地址很典型的问题,在此我阐述一下我的个人理解. 一.提出问题 他问的问题没有这么简单,但是差不多就是这种意思,我在晚上找个典型事例,如下: DS ...

  6. AS3 转 Java

    不错,我就是as3转java的程序猿. 大概两年前加过as3的QQ群里,有很多群友说as3发展前景不好,很多要转语言.我当时也想转,一直苦于没机会.现在机会终于来了... 首先说明一点,as3并不会像 ...

  7. python学习文章

    推荐大家看看,这几个涉及到解决问题了 用机器学习算法解决问题(图文+程序) http://www.bida.org.cn/index.php?qa=7 数据的价值是提升业务而不仅仅是用户画像 http ...

  8. OAF 中的EO 和VO

    EO :oracle.apps.fnd.framework.server.OAEntityImpl VO:oracle.apps.fnd.framework.server.OAViewRowImpl ...

  9. Android遍历获取Office格式(Word,Excel,PPT,PDF)的文件并打开

    此案例主要是模仿QQ加载WPS(Word,Excel,PPT)本地文件可打开查看,使用ListView加载,使用线程扫描SD卡下所有目录加载指定的Word,Excel,PPT等格式的文件,ListVi ...

  10. Struts框架——(三)动态ActionForm

    一.DynaActionForm的引入意义 使用ActionForm把表单数据单独封装起来,而且提供了自动的数据验证,简化了代码的编写,给我们带来了极大的方便. 但是,ActionForm也存在一些明 ...