layer的iframe弹框中父子元素的传值

项目中,左侧导航树,右侧是 iframe 嵌套的页面,在右侧页面中又有layer弹框,可以说是有两层 iframe 框架。

所以查询网上的parent什么的方法都不能用。自己摸索的下面的方法:

1、父页面取子页面的值:

 top.moreFunLayer = top.layer.open({
                type: 2,
                title: "常用功能",
                area: ["600pt", "150pt"],
                content: './workbench/comUseFunc_add.html',
                success: function(layero, index) {
                    // console.log(index);
                    console.log(layero);
                    console.log(layero[0]);
                    console.log(typeof layero[0]);
                    console.log( $(layero[0]).find("#layui-layer-iframe"+index).contents().find("#btn").val() );
                    console.log(layero[0] instanceof jQuery);
                    console.log(layero[0] instanceof HTMLElement);
                }
            });

2、子页面取父页面的值

 $("#btn").click(()=>{
            console.log("子页面button触发");
            $(parent.document.getElementsByClassName("J_iframe")[0]).attr("src");
            console.log( $(parent.document.getElementsByClassName("J_iframe")[0]).contents().find("#div").html() );
        })

总结:

1、子页面要是想取父页面中的js数据,可以在页面中设置一个display为none的div元素或者隐藏的输入框。然后把数据赋值给看不见的元素,然后子页面取父页面的元素值。

2、取元素值的时候,中间间隔的有 iframe 元素的话,必须先定位 iframe 元素,然后取 iframe 元素内容,再定位元素。

猜你喜欢

转载自www.cnblogs.com/smile-fanyin/p/10942918.html