首页 > 代码库 > Bootstrap 模态框 + iframe > 打开子页面 > 数据传输/关闭模态框
Bootstrap 模态框 + iframe > 打开子页面 > 数据传输/关闭模态框
父页面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 = http://www.mamicode.com/$.parseJSON(evt.data);"C"){ $("#myModal").modal("hide"); }}子页面corsPage.html，跨域/单独的页面(iframe打开，跟父页面无关)，
如何关闭模态框/传值给父页面， JS代码:
var data_ = {"opt":"C"};//Close/Hide modalwindow.parent.postMessage(JSON.stringify(data_), ‘*‘);
Bootstrap 模态框 + iframe > 打开子页面 > 数据传输/关闭模态框
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。