用Bootstrap框架弹出iframe页面 在弹出的模态框中载人iframe页面,bootstrapiframe

HTML代码:

<div class="modal fade" id="NoPermissionModal">
    <div class="modal-dialog" >
        <div class="modal-content">
            <div class="modal-header">
                <%-- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>--%>
                <button type="button" class="close" onclick="window.history.go(-1);">×</button>
                <h4 class="modal-title" id="NoPermissionModalLabel">系统消息</h4>
            </div>
            <div class="modal-body">
                <iframe id="NoPermissioniframe" width="100%" height="50%" frameborder="0"></iframe>
            </div>
            <div class="modal-footer">
<%--                <button type="button" class="btn btn-default " data-dismiss="modal">    关  闭    </button>--%>
                <button class="btn btn-default"  type="button" onclick="window.history.go(-1);" >    关  闭    </button>
            </div>
        </div>
    </div>
</div>
 
 <input type="button" value="弹出模态框iframe" class="btn btn-primary" id="btnclick" ><img src="//img-blog.csdn.net/20140923180316546?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2hpbmFwbGFu/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />

 

Js代码:

$(function(){
    $("#btnclick").click(function(){
        var frameSrc = "../ErrorPages/NoPermission.html";
        $("#NoPermissioniframe").attr("src", frameSrc);
        $('#NoPermissionModal').modal({ show: true, backdrop: 'static' });
    });
});

iframe中嵌入一个jsp页面,需要在iframe中弹出一个div层,可是这个div不可以超出iframe的范围

 

思路:
把div层定义在父窗口中,弹出div功能定义为一个方法popupDiv;在iframe页面调用父窗口的方法:
window.parent.popupDiv()。
 

iframe中嵌入一个jsp页面,需要在iframe中弹出一个div层,可是这个div不可以超出iframe的范围 你问题解决了

 

iframe中的弹出层无法弹到外面去的。

要实现这种弹出层,只有一种思路,就是把你要弹出的内容传递到主框架中,然后在主框架里弹出。
 转载自:http://www.bkjia.com/webzh/883250.html

posted @ 2015-04-07 14:59  小小城城  阅读(8976)  评论(0编辑  收藏  举报