上传文件——设置单个或多个文件上传及上传一次后再次点击上传无效

原创于 2018-03-01 17:01:04 发布 · 4.9k 阅读

2 ·

CC 4.0 BY-SA版权

本文介绍了如何在网页中实现文件上传功能，包括单个文件和多个文件的上传方式，并提供了具体的HTML代码示例。同时，还讨论了解决文件重复上传的问题。

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

在上传文件时可以根据需要选择一个或者多个文件进行上传

上传单个文件：

<input type="file" id="file" value="上传图片"  onchange="uploadImage(this)"
		        	style="position:relative;left: -141px;height: 110px;opacity: 0"/>

上传多个文件：

一次选择多个文件进行上传时，需要对input添加multiple属性

<input type="file" id="myFile" value="上传图片"  onchange="uploadImage(this)" multiple="multiple"
		        	style="position:relative;left: -141px;height: 110px;opacity: 0"/>

在进行上传时可能会出现同一个文件无法二次上传的情况，出现该问题的原因是onChange监听的是input的值，在点击选择之前input的值并没有改变。解决办法：只需要在上传成功之后进行回调，将input的值置空即可再次上传该文件。