使用iframe和layer实现弹框

使用iframe和layer实现弹框

一、div加iframe的效果
(1)在父页面定义一个div

<div id="popDiv" style="display: none;">
    <iframe id="popIframe" border="0" frameborder="no">iframe>
div>

(2)给div的iframe定义一个页面，该地址为后台的servlet地址，默认访问方式为get

path = "${_baseUrl}/departmentController/selectManagerUser?inputId="+inputId+"&managerId="+managerId;

$("#popIframe").empty();   
$("#popDiv").dialog({
    title:'选择人员',
    autoOpen: true,
    modal: true,    
    height: 360,
    width: 700
}); 
$("#popIframe").attr("width","100%");
$("#popIframe").attr("height","95%");
$("#popIframe").attr("src",path);

(3)关闭iframe弾框的方法

function closeWin(){
    $("#popDiv").dialog('close'); 
}

(4)在子页面关闭窗口时，如果要调用父页面的对象及方法，需要在前面加parent

parent.closeWin();

二、layer弹框
(5)用layer弹窗实现iframe一样的效果

layerIndex = layer.open({
             type: 2,
             title:'选择人员',
             area: ['700px', '360px'],
             fixed: false, //不固定
             maxmin: true,
             shim: true,
             content: path,
             success: function(){
                 alert(sucess);
             },
             moveEnd: function(layero){
                 alert(moveEnd);
             },cancel: function(){ 
                 alert(cancel);
            }
        });


function closeWin(){
        layer.closeAll();
    }