layui 向iframe弹窗传值 子父页相互传值

子页调用父页面

父页面代码

//用来供子页面成功后调用
    window.success  = function(){
        renderCardData();
        toastr.success('策略添加成功');
    };

子页面代码

        $.ajax({
                   type:'post',
                   url:baseUrl + '/abc...',
                   data:JSON.stringify(data),
                   processData: false,
                   contentType: 'application/json',
                   success:function(res){
                       handleResponse(res,function(data){
                          //调用声明好的方法
                           window.parent.success();
                          //关闭弹窗
                          var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                          parent.layer.close(index); //再执行关闭
                       })
                   }
               })

父页面向子页面传值

父页面代码

          var index = layer.open({
                        title: '编辑用户',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: ['100%', '100%'],
                        content: '../page/table/edit.html',
                        //打开弹窗后回触发succes回调,有俩个参数分别是当前层DOM当前层索引
                        success: function(dom, index) {
                           //通过索引获取到当前iframe弹出层
                            var iframe = window['layui-layer-iframe' + index];
                            //调用iframe弹出层内的方法
                            iframe.edit(data);
                        },
                        //关闭弹窗后触发
                       end: function(){
                            console.log("1111")
                        }
                    });

iframe子页面代码


        var edit = function(data) {

            console.log(data)

        }

也可以在父页面通过dom直接赋值:


          var index = layer.open({
                        title: '编辑用户',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: ['100%', '100%'],
                        content: '../page/table/edit.html',
                        //打开弹窗后回触发succes回调,有俩个参数分别是当前层DOM当前层索引
                        success: function(dom, index) {
                            //也可以通过dom获取iframe的元素直接赋值
                            let iframeDom = $(dom[0]).find("iframe").eq(0).contents();
                            //通过获取的Dom直接给子页的input赋值
                            iframeDom.find("input[name='username']").val(data.username)
                        }
                    });

  • 12
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值