• 用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

  • 相关阅读:
    elasticserach7.X 安装,配置
    org.elasticsearch.bootstrap.StartupException: ElasticsearchException[failed to bind service]; nested: AccessDeniedException[/home/ae/es761/data/nodes];
    Java 八大基本数据类
    java 输入scanner
    idea生成javaDoc文件
    时间戳和日期的相互转化
    自1970 年1月1日8时0分0秒至当前时间的总秒数什么意思?
    JDK的卸载与JDK的安装以及环境变量配置
    Java特性与优势
    图片识别
  • 原文地址:https://www.cnblogs.com/JD-XIAOMEI/p/4398344.html
Copyright © 2020-2023  润新知