layer相關使用

父子頁面傳參數

轉自：https://blog.csdn.net/babyxue/article/details/76854106

一、父頁面打開子頁面並向子頁面傳參數

function setChooseValues(ret){ 
        var oView = document.getElementById("userName");  
        var oValue = document.getElementById("userIds");  
        var i = 0;  
        if( ret != null){  
            oValue.value="";  
            oView.value="";  
            oView.title="";  
            for( x in ret){  
                i++;  
                oView.title=oView.title + ret[x].name+",";  
                oValue.value=oValue.value+ret[x].id+",";  
                oView.value = oView.value+ret[x].name+"\n";  
            }  
            if(i==0){  
                oView.value="";  
            }  
        }  
    }  
    function OpenFrame( oValue, oView) {  
        var dialogArgumentsA = new Array(oValue.value , spitToString(oView));  
        var url = "${rootPath}/page/system/roleallot/role_allot.jsp";  
        layer.open({  
            type: 2,  
            skin: 'layui-layer-lan',  
            title: '選擇人員',  
            fix: false,  
            shadeClose: false,  
            maxmin: true,  
            id:'selectUser',  
            move: false,  
            closeBtn:2,  
            //如下代碼爲打開窗口添加按鈕  
            /* btn: ['肯定', '取消'], 
            btnAlign: 'c', 
            yes: function(index, layero){ 
                /* //layer.closeAll();//關閉全部彈出層 
                //var parentWin = layero.find('iframe')[0]; 
                var parentWin  = layer.getChildFrame('body', index); 
                alert(parentWin); 
                parentWin.contentWindow.doOk(); 
                //layer.close(index);//這塊是點擊肯定關閉這個彈出層 
            }, */  
            area: ['750px', '450px'],  
            content: url,  
            success: function(layero, index){  
                var body = layer.getChildFrame('body', index); var iframeWin = window[layero.find('iframe')[0]['name']]; //獲得iframe頁的窗口對象，執行iframe頁的方法：iframeWin.method(); 
                var res = window["layui-layer-iframe" + index].method(); //或者這樣調用子頁面的方法
                var ids = dialogArgumentsA[0].split(",");  
                var names = dialogArgumentsA[1].split(",");  
                for (var i = 0; i < ids.length; i++ ) {  
                    if ('' != ids[i]) {  
                        var option = $("<option>").val(ids[i]).text(names[i]);  
                        body.find('select').append(option);  
                    }  
                }  
            }  
        });  
    }    

 

二、子頁面向父頁面傳參數並關閉彈窗

function newBuildReturnValue(selectName){
    var ret = new Array(); 
 
          $("#"+selectName+" option").each(function(){
 
          //遍歷全部option    
              var value = $(this).val();   //獲取option值     
              var text = $(this).text();  
              if(text!=''){     
                  var o = new Element(value, text, 0);  
                ret.push(o);  
              }    
        });  
      return ret;  
    }  
    //點擊肯定向子頁面傳參並關閉窗口  
    function doOk(){  
        var ret = newBuildReturnValue("select");  
        parent.setChooseValues(ret);  //執行父頁面的方法
        var index = parent.layer.getFrameIndex(window.name);  //得到父頁面的Index
        parent.layer.close(index);  //關閉父頁面層
    }  
      
    //點擊取消關閉窗口  
      
    function doCancel(){  
        var index = parent.layer.getFrameIndex(window.name);  
        parent.layer.close(index);  
    } 
 

layer彈出層的關閉問題 

轉自https://www.cnblogs.com/ssh-html/articles/6698298.html 

就是在執行添加或修改的時候，須要將數據提交到後臺進行處理，這時候添加成功以後最理想的狀態是關閉彈出層而且刷新列表的數據信息，以前一直想實現這樣，可一直沒有成功，今天決定好好弄一弄，在仔細看過layer的幫助手冊以及查閱資料以後，有了如下的解決辦法：

1、關閉彈出窗

　　這是layer官網給出的幫助手冊，講解的比較詳細

分紅兩種狀況：

一、彈出層不是新的頁面的時候,直接得到該彈窗的索引，而後執行close方法

layer.close();

二、彈出窗是新的頁面的時候

var index=parent.layer.getFrameIndex(window.name);

parent.layer.close(index);

2、關閉彈窗以後刷新父頁面

　　例如：在增長用戶的時候，增長會彈出一個新的彈窗頁面，增長成功以後會有提示性的小的alert，在點擊肯定以後，彈窗頁面關閉，而且刷新用戶列表的頁面數據。

　　只須要在關閉彈窗的時候加這個window.parent.location.reload();//刷新父頁面

 

 

多層iframe彈出區域問題

　　默認layer.open只能在父頁面的範圍內展示，如需在頂層顯示，不限制顯示的範圍需使用top。

top.layer.open({
              type: 2,
              title: '標題',
              shadeClose: true,
              shade: 0.3,
              area : ['850px' , '450px'],
              content: 'http://sentsin.com' //這裏content是一個URL，
            });

　　顯示在父窗口：

parent.layer.open({
              type: 2,
              title: '標題',
              shadeClose: true,
              shade: 0.3,
              area : ['850px' , '450px'],
              content: 'http://sentsin.com' //這裏content是一個URL，
            });

 

子窗自動高度問題

　　如子窗口無ajax，不會改變高度，能夠在父窗口中增長：

success: function (layero, index) {
                    layer.iframeAuto(index);
                },

　　不然須要在子窗口ajax加載完畢後執行：

parent.layer.iframeAuto(parent.layer.index);

　　其中parent.layer.index會得到父窗口最新打開的index。