iframe 嵌套頁面（模態框中嵌套）

需求：

點擊新增 彈出另一個系統頁面，進行操作

代碼：

html:

 <button type="button" class="btn btn-primary btn-sm" id="addRuleSeletedBtn">新建</button>

<div class="ruleModal hide">
    <iframe style="width:100%;height:100%" id="ruleModalIfram" src=""></iframe>
    <button type="button" class="btn btn-primary btn-md" id="backRule"
            style="background: #1989FA;border: #1989FA; margin: 10px;width: 200px;">返回</button>

</div>

<div class="shade hide">
</div>

css:

    .hide{
        display:none;
    }

    .ruleModal{
        position:fixed;
        left:0;
        top:0;
        right:0;
        bottom:0;
        /*width:900px;*/
        /*height:500px;*/
        /*margin-left:-450px;*/
        /*margin-top:-250px;*/
        z-index:10;
        background-color:white;
        overflow: auto;
        text-align: center;
    }

    .shade{
        position:fixed;
        left:0;
        right:0;
        top:0;
        bottom:0;
        background-color:rgba(0,0,0,0.6);
        z-index:9;
    }

js：

點擊新增按鈕 獲取 地址及 通往另一個系統的 token 通行證，並給iframe src屬性賦值

    //新增規則
    $('#addRuleSeletedBtn').on('click',function(){
        $('.hide').removeClass('hide'); // 打開模態框
        $.ajax({
            "url": path + "XXXXXX",
            "type": "POST",
            success: function (data) {
                // window.location.href=data;
                var dataSrc = data+'&page=XXXX&system=XXXX'
                $('#ruleModalIfram').attr('src',dataSrc)

            }
        });
    })

    $('#backRule').on('click',function(){
        $('.ruleModal,.shade').addClass('hide'); // 點擊返回隱藏模態框
        initEventRule()
    })