layui框架是个前端的非常容易上手的框架。但是第一次接触,在父页面给子页面弹窗上遇到了大坑,以至于钻牛角尖很久都没有解决。
网上百度了一大堆用parent.layer.父页面参数名的方法毫无疑问都是没能解决我的需求,当然也可以利用浏览器缓存session来达到传值目的,但是这样的话没有用框架封装的方法写的那么优雅。
下面是我的弹窗控件
layer.open({
type: 2,
area: [($(window).width() * 0.9) + 'px', ($(window).height() - 50) + 'px'],
fix: false, //不固定
maxmin: true,
shadeClose: true,
shade: 0.4,
title: "修改信息",
content: "alteruser.html",
success: function (layero, index) {
// 获取子页面的iframe
var iframe = window['layui-layer-iframe' + index];
// 向子页面的全局函数child传参
iframe.child(data);
}
});
success后面跟着方法来调用子页面iframe的全局函数child()。
然后是我的子页面js
<script>
function child(data) {
....
}
</script>
child方法是子页面js定义的全局函数,其中的参数data就是从前端传值过来的数据,在函数里面就可以进行一系列的对数据的 调教(雾)了。
当然还有另一种更不优雅的方法,调用浏览器的本地存储了。layui也对本地存储进行了封装。
详情见layui底层方法,这里就不一一介绍了。