layer弹框,弹出后自动关闭
今天做项目,出现一个问题,需求是用ajax做文件上传功能,代码写好之后,测试发现问题。
弹出层出现以后我没有主动点击确定和关闭等操作,程序自动关闭了弹出层
一步一步排查,找到了错误,首先,先确认你页面上有没有发生刷新或者其他弹出
我排查以后发现我form里有个class,这个class就是ajax提交并返回弹出框,我把这个class
去掉以后测试还是不行,继续排除,后来发现是button 的type问题,话不多说,直接上代码
<--前端代码--> <form id="uploadForm" class="form-horizontal" enctype="multipart/form-data"> <input type="file" name="file" class="file" multiple="multiple" required=""> <button type="button" id="upload" class="btn btn-xs btn-purple"> <span class="ace-icon fa fa-cloud-upload icon-on-right bigger-110"></span>上传文件 </button> </form>
<--JS代码--> <script type="text/javascript"> $(function () { $('#upload').click(function () {
//这里我是需要做一个加载转圈的效果,如不需要可去除 var index = layer.load(1, { shade: [0.1,'#fff'] //0.1透明度的白色背景 }); var formData = new FormData($('#uploadForm')[0]); $.ajax({ url:"www.baidu.com", type:'post', data:formData, dataType:'json', cache:false, processData: false, contentType: false, success:function (e) { layer.close(index); if (e.status == 200) { layer.alert(e.msg, { icon: 1, skin: 'layer-ext-moon' }) }else { layer.alert(e.msg, { icon: 2, skin: 'layer-ext-moon' }) } } }); }); }); </script>
参考资料:http://fly.layui.com/jie/1106/
解决了,欢迎评论,一起进步一起学习。
本文来自博客园,作者:郭德纲又打人了嘿,转载请注明原文链接:https://www.cnblogs.com/blibli/p/9055622.html