layerUI 父子iframe之间的操作

最新推荐文章于 2021-05-18 21:09:03 发布

原创最新推荐文章于 2021-05-18 21:09:03 发布 · 461 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

layer.js 同时被 2 个专栏收录

1 篇文章

订阅专栏

layerUI

1 篇文章

订阅专栏

本文介绍了一种在父iframe页面通过open()方法打开子iframe层，并实现子iframe层与父层之间的数据请求、关闭及刷新操作的方法。父层定义了faterReload方法，用于根据flag参数决定是否刷新页面或执行特定操作；子层则通过调用parent.faterReload()方法，传入操作状态，以控制父层的行为。

父iframe页面open（）打开一个子的iframe层，子iframe层与父iframe的操作：
1如果你想子iframe请求一个数据加载完成时，关闭子，刷新父iframe层的话：
父iframe层写一个方法：

//刷新页面
    function faterReload(flag){
        if(flag){
            setTimeout(()=>{
                window.location.reload();
            },1000)
        }  
    }

子iframe层操作完成是，执行父层方法并传递一个flag参数：

parent.faterReload(true)

2.如果你不想刷新页面，只想对父层做一系列操作的话，你就要在关闭子层页面，因为父层没有刷新是不会关闭子层的
父层写一个操作方法：

function faterReload(flag){
        if(flag){
            $('#loadTable').find('tbody tr').eq(loadorderindex).remove();
        }
    }

子层代码：

$.ajax({
            url:'',
            type:'post',
            data:{"id":id},
            dataType:'json',
            success:function(res){
                $(tar).removeClass('flag');
                layer.close(loading);
                if(res.code==0){
                    parent.faterReload(true);
                    layer.msg('下单成功');
                    setTimeout(() => {
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index); 
                    }, 2000);
                     
                }else{
                    parent.faterReload(false);
                    layer.msg(res.msg);
                     
                }
            }
        })

等待两秒钟后关闭是因为确保请求成功，数据返回后关闭
你还可以根据不同情况，执行父层不同的方法