easyUI dialog 缓存问题引起form表单提交文件的错乱

本文解决了一个关于easyUI对话框中文件上传功能的问题,包括处理缓存导致的重复上传同一文件及对话框无法重复打开等异常行为,并提供了解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 最近在做项目的时候遇到一个看似简单 但是又很头疼的问题,功能是这样的:使用easyUI的dialog弹出的一个form的提交文件的上传功能,简单吧?就这么简单一个问题花了我一天的时间,当然脑子比较不灵光哈,废话少说进入正题,遇到的问题是这样的:在上传文件的时候初次操作'不选文件直接上传',当然会上传失败了!服务器返回的没毛病! 问题来了,,,,当dialog.close()之后从新上传文件,这次的操作是'选择一个文件'点击上传,当然会上传成功了!这是正常的情况下才会出现的,但是咱们说的不是正常情况,返回的结果跟第一次是一样的,服务器返回的额是上传失败!又测试了一次,重新刷新大页面,初次操作"选择一个文件",服务器返回上传成功!第二次操作"无论选择文件还是不选择文件"都会上传成功,但是上传的初次选择的那个文件,在继续操作又正常了!只有初次进去的时候的前两次操作有问题(可能测试的还不够全面),但是就抓住这几个现象想的我头都大了,没办法问一下度娘吧,查了好多么有找到正题,

突然看到一个博客还是很贴近的https://www.cnblogs.com/lwucoder/archive/2017/03/16/web_cache_method.html,有兴趣可以进去看看,有三种方法,一是禁止浏览器从本地计算机中访问页面的缓存缓存内容,二是表单每次提交以后reset()一下,三是ajax清理缓存,就挨个试了下,可能遇到的情况不一样,方法一对我无效,方法二有效,呱唧呱唧,出去抽根烟庆祝下.....然而只解决了一个现象的问题,初次上传文件,第二次就会上传正常了,不是缓存初次的文件了,问题解决了,再试试初次不上传文件,第二次选择一个文件试试,心碎了......问题还在,

多方求助,最后在同事的帮助下知道了,easyUI的dialog缓存问题,把dialog,$(this).dialog('destroy')掉,又试了下,好使了,都好用了,终于完事了,就在我打算出去抽一包烟庆祝的时候,又有一个新问题来了,就是dialog只能弹出来两次(至今不知道原因),两次操作以后就歇菜了,也是按钮再点击不管用了,因为你把dialog destroy掉了,除非刷新整个页面重新在建,但是这不符合操作习惯,也很容易降低客户体验,所以又是一顿百度,很快就找到一个除根的方法了,那就是"操作完以后直接吧div remove掉,再从新创建一个自己的div,问题完美解决,附上解决方法:

body里面的<div id="a"></div>

function upload(){

        var dialogParent = $('#a').parent();  

        var dialogOwn = $('#a').clone();  

     dialog = $('#a').dialog({
                title: '导入',    
                href: '页面',
                maximizable: false,
                modal: true,
                onClose : function() {
                dialogOwn.appendTo(dialogParent); 
                        $(this).dialog('destroy').remove();
                    },

    buttons: {  

       "取消"function () { dialog.dialog('close');},  

        "确定"function () { dialog.dialog('close')}  

           },


}

好了到此就算完美解决了,抽烟庆祝下

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值