使用layer的iframe层提交表单后，需要关闭当前的iframe层，然后刷新父页面的方法（一）

上传图片的使用需要弹出一个iframe层来使用ajax弹出窗口

ajax图片上传后，需要关闭iframe弹出层窗口，更新父级页面

代码如下

$.ajax({
                type: "POST",
                url: "/app/userinfo/uploadimg1",
                data:form,
                datatype:'json',
                processData:false,
                contentType:false,
                success: function(data) {
                	console.log(data)
                	var ResData=$.parseJSON(data);
	            	var Jcode=ResData.code;
                	if(Jcode==0){
                		layer.msg('图片上传失败', {icon: 2});
                		layer.closeAll(); //疯狂模式，关闭所有层
                	}else if(Jcode==1){
                		layer.msg('图片上传成功', {icon: 1});
                		var index = parent.layer.getFrameIndex(window.name);  
						setTimeout(function(){
							parent.layer.close(index);//关闭弹出层
							parent.location.reload();//更新父级页面（提示：如果需要跳转到其它页面见下文）
						}, 2000);
						
                	}
                    
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('图片上传失败', {icon: 2});
                    layer.closeAll(); //疯狂模式，关闭所有层
                    return false;
                }
            });

//更新父级页面（提示：如果需要跳转到其它页面）

parent.location.href=url; //这个url可以为变量或是常量，

再附上一份参考文档示例（下文为转载）：

好久都没有用过layer了，最近要用layer来做一个报名页面，是这样的，现在有一个活动的列表页面，我需要点击每一个列表就弹出报名，然后通过ajax后台传值确认前台，如果报名成功则关闭这个iframe窗口，并且刷新列表页。下面是方法：

扫描二维码关注公众号，回复： 1011985 查看本文章

 // 这个是在iframe里面的js代码
 var url = '/activity';
        var  frameindex= parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
         $(document).on('click','[type=submit]',function(){
          var index = layer.load(1, {
                shade: [0.1,'#fff'] //0.1透明度的白色背景
            });
            $.post(url,data,function(ev){
                    if(ev.status=='success'){
                            layer.msg(ev.msg);
                            parent.location.href="https://blog.csdn.net/";//示例：跳转到CSDN博客也是可以的
                    }else{
                        layer.close(index);
                        layer.msg(ev.msg);
                    }
            },'json')
         });

在这个里面需要注意的就是success里面的方法了，这里刷新父页面是采用的parent.location.href="/activity";，注意这个地方的parent，还有这个地方不能够写成：

layer.msg(ev.msg);
parent.layer.close(frameindex); //再执行关闭
parent.location.href="https://blog.csdn.net/";

这个是我做的时候发现的，我大概就是认为关闭了之后就不会知道这个parent是那个了，或者关闭窗口js就不会运行了。

这个以后弹窗提交表单会非常有用，值得我自己整理一下思路，呵呵哒！！

更多前端资讯和学习心得请关注下方公众号，还有视频教程可以领取

使用layer的iframe层提交表单后，需要关闭当前的iframe层，然后刷新父页面的方法（一）

猜你喜欢