layui弹窗 iframe子页面弹窗如何覆盖父级页面

使用iframe进行嵌套页面，需求要在iframe内点击按钮，出现弹窗，但是实现中发现这个弹窗只覆盖了子页面，父页面内容仍可点击。

要实现覆盖整个页面，这里就需要用到layui中的方法，parent.layer.open({}）。在父级页面打开弹出层。

此处显示的是加载动画，效果如下图：

具体操作如下：

注意：在外面的父级页面和iframe里面的子页面都需要，引用layui.js和layui.css

第一步：在父页面添加

    layui.use('layer', function(){
                      var layer = layui.layer; 
            });

第二步：在子页面添加

    var index;
    $(".clickbox").bind("click",function(){
              index = parent.layer.open({ //在父窗口打开
                        type: 3,
                              content: ""
              });
                 setTimeout(function(){
                  parent.layer.close(index);
              },5000);
    });

详细还可参考https://blog.csdn.net/yufengaotian/article/details/79231552#commentsedit