Layer component multiple iframe pop-up layers open and close and parameter transfer

1. Open the js code of the iframe pop-up layer

1. Example 1

layer.open({
type: 2, // iframe类型
title: 'layer mobile页',
shadeClose: true,
shade: 0.8,
area: ['380px', '90%'],
content: 'mobile/' //iframe的url
});

2. Example 2

layer.open({
  type: 2,
  title: false,
  closeBtn: 0, //不显示关闭按钮
  shade: [0],
  area: ['340px', '215px'],
  offset: 'rb', //右下角弹出
  time: 2000, //2秒后自动关闭
  anim: 2,
  content: ['test/guodu.html', 'no'], //iframe的url，no代表不显示滚动条
  end: function(){ //此处用于演示
    layer.open({
      type: 2,
      title: '很多时候，我们想最大化看，比如像这个页面。',
      shadeClose: true,
      shade: false,
      maxmin: true, //开启最大化最小化按钮
      area: ['893px', '600px'],
      content: '//fly.layui.com/'
    });
  }
});

3. Example 3: Open a new popup layer B in popup layer A, which is the same DOM level as popup layer A

// 在弹出层A(子页面1)打开新弹出层B(子页面2)，弹出层A、B在同一DOM层级，
// 即父页面内有多个iframe，子页面2不嵌套在子页面1中；
// 在弹出层A(子页面1)中封装如下方法，在需要触发打开新弹出层B事件中执行如下方法；
function openLayerUrl(url, width, height) {
                parent.layer.open({
                type: 2,
                title: false,
                closeBtn: false,
                shadeClose: false,
                shade: 0.6,
                border: [0],
                area: [width <= 0 ? "auto" : width + 'px', height <= 0 ? "auto" : height + 'px'],
                content: url,
            })
        }

2. Close the js code of the iframe pop-up layer

1. Close a specific iframe

//当在iframe页面关闭自身时，在iframe页执行以下js脚本
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
parent.layer.close(index); //再执行关闭

2. Close all popup layers (no popup overlays)

layer.closeAll(); //疯狂模式，关闭所有层
layer.closeAll('dialog'); //关闭信息框
layer.closeAll('page'); //关闭所有页面层
layer.closeAll('iframe'); //关闭所有的iframe层
layer.closeAll('loading'); //关闭加载层
layer.closeAll('tips'); //关闭所有的tips层

3. Refresh another pop-up layer

1. Refresh the iframe layer with known index

//官方示例，其中参数index为iframe索引，第二个参数为iframe的URL
layer.iframeSrc(index, 'http://sentsin.com')

2. Refresh the iframe layer of unknown index

parent.$("iframe").each(function () {
   $(this).attr('src', $(this).attr('src'));//需要引用jquery
})

Four, iframe pop-up layer parameter transfer

1. The parent page passes parameters to the iframe pop-up layer

var collectionId = parent.$("#hideCollectionId").val();
//可在父页面定义隐藏域，id为hideCollectionId，需要引用jquery

2. The iframe pop-up layer A passes the parameters to the iframe pop-up layer B

For example, if the button of pop-up layer A opens another pop-up layer B, you can pass the parameters in the form of URL in the content parameter configuration of the layer.open() function. You can also consider using success (callback after popup) and end (callback after destruction). ), cancel (close callback) and other parameter configurations to do other work;　　

Five, multiple iframe pop-up layers (nested)

1. Pop-up layer opening and closing

It is also possible to use nested iframes, such as iframe pop-up layer B (sub-page 2) is nested in iframe pop-up layer A (sub-page 1), iframe pop-up layer A is nested in the parent page,

Open pop-up layer A on the parent page, and the parent page script uses layer.open();
Open popup layer B in popup layer A, and use layer.open() for the subpage 2 script;
Close pop-up layers A and B in pop-up layer B, and pop-up layer B uses the script parent.parent.closeAll();

2. Pop-up layer parameter transfer

jQuery gets the parent page element:
parent.parent.$("#hideCollectionId").val();//Get the non-dynamically generated element of the parent page of the parent page
$("#hideCollectionId",parent.parent.document). val();//Get the dynamically generated element of the parent page of the parent page

Reference address: https://www.cnblogs.com/EvanFan/p/7718065.html