IE不能重复上传文件名相同的文件问题（layui上传组件解决方案及普通上传附件解决方案）

不念不忘少年蓝@ 2023-02-13 12:28 21阅读 0赞

在layui上传组件的done回调中增加如下代码：

/* IE下同个文件多次上传无反应 */
    if (layui.device() && layui.device().ie) { 
    	$('.layui-upload-file').attr('type', 'hidden');
    	$('.layui-upload-file').attr('type', 'file');
    }

亲测有用，如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDI0OTc1NA_size_16_color_FFFFFF_t_70]

若不是layui上传组件，可参考以下博客：

测试反应了一个问题，就是在ie底下上传了一个文件，然后取消了，然后再上传那个同名文件，上传不了，除非刷新一下页面。然后用ie 10看了下，果真存在这个问题。

打印发现，即使用js把input file的值清空了，在ie 10底下，仍能获取到之前文件值。所以导致在input file绑定change事件的时候，根本就没有触发，因为它的属性值没变。而firefox不会存在这种问题，每次打印input file的时候会是空值。

然后网上搜索发现，ie底下js是清不掉input file的值的，需要重置表单。

由于JQuery中，提交表单是像下面这样的：  
$(’\#myform’).submit()

所以，想当然的认为，重置表单，当然就是像下面这样子喽：  
$(’\#myform’).reset()

但是这样firebug查看报了个错。reset方法没定义。原来JQuery中没有reset方法，然后通过一种间接的方法，如下：  
$(’\#myform’)\[0\].reset()

也就是通过调用 DOM 中的reset方法来重置表单。搞定！

而且在input file值方面，firefox取到的是当前文件名，而ie和Chrome会在文件名前面加一个’C:\\fakepath’，据说是出于安全性的考虑，上传文件时屏蔽了真实的本地文件路径，而以“C:\\fakepath\\”取代之。

来源：[https://blog.csdn.net/ycdyx/article/details/20127313][https_blog.csdn.net_ycdyx_article_details_20127313].

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDI0OTc1NA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200529141113753.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDI0OTc1NA==,size_16,color_FFFFFF,t_70
[https_blog.csdn.net_ycdyx_article_details_20127313]: https://blog.csdn.net/ycdyx/article/details/20127313