不要采用删除当前input[type=file]这个节点,然后再重新创建dom这种方案,这样是不合理的。
解释如下:
input[type=file]使用的是onchange去做,onchange监听的为input的value值,只有再内容发生改变的时候去触发,而value在上传文件的时候保存的是文件的内容,你只需要在上传成功的回调里面,将当前input的value值置空即可。
event.target.value='';

转自https://www.cnblogs.com/imsomnus/p/6227393.html

input type file onchange上传文件的过程中,同一个文件二次上传无效的问题。的更多相关文章

  1. input type file onchange上传文件的过程中,遇到同一个文件二次上传无效的问题。

    不要采用删除当前input[type=file]这个节点,然后再重新创建dom这种方案,这样是不合理的.解释如下:input[type=file]使用的是onchange去做,onchange监听的为 ...

  2. <input type="file">上传文件并添加路径到数据库

    注:这里是用的mvc所以没法用控件 html代码 <form method="post" enctype="multipart/form-data"> ...

  3. 文件上传按钮input[type="file"]按钮美化时在IE8中的bug【兼容至IE8】

    首先看一下完成后的效果,鼠标移入可改变为手指的效果. 在此就不加图标了 <label class="file-upload"> <span>上传附件< ...

  4. input type=file实现图片上传

    <label for="file"> <img src="images/morende.jpg" alt=""> & ...

  5. 上传文件 隐藏input type="file",用text显示

    <div> <span>上传文件:</span> <input type="file" id="upload_file" ...

  6. input type='file'文件上传自定义样式

    使用场景: 在未使用UI库时免不了会用到各种上传文件,那么默认的上传文件样式无法达到项目的要求,因此重写(修改)上传文件样式是必然的,下面的效果是最近项目中自己写的一个效果,写出来做个记录方便以后使用 ...

  7. jquery的input:type=file实现文件上传

    <!DOCTYPE html> <html> <head> <title>html5_2.html</title> <style> ...

  8. input type="file"文件上传到后台读取

    html页面(表单采用bootStrap) js部分: //更换头像时把上传的图片post方式到控制器 <script type="text/javascript"> ...

  9. input[type='file']获取上传文件路径案例

    最近在项目时,需要获取用户的上传文件的路径,便写了一个demo: <body> <input type="file" name="" valu ...

随机推荐

  1. java单元/集成测试中使用Testcontainers

    1.Testcontainers介绍: Testcontainers是一个Java库,它支持JUnit测试,提供公共数据库.SeleniumWeb浏览器或任何可以在Docker容器中运行的轻量级.一次 ...

  2. Unity 游戏框架搭建 2019 (二十三) 备份与版本号&危险的操作

    先列出上一篇的总结: 要做的事情: 备份:导出文件,并取一个合理的名字. 遗留问题: 第八个示例与之前的示例代码重复,功能重复. 约定和规则: 每个示例在 QFramework 目录下创建一个文件夹, ...

  3. Lisp-01: 相关开发环境配置部署

    Common Lisp 学习笔记系列01 要学一门编程语言,首先需要将语言的环境配置好.如果想要个直接上手的环境,感谢日本的大神 Shirakumo,打造了一个 Common Lisp 的 IDE - ...

  4. Linux 常用命令(遇见了,就记录了 ,随缘吧)

    1.实时查看最后日志(默认10条) # tail -f xxxxxx.log 2.查看结尾多少条日志 # tail -n30 -f xxxx.log 3.根据关键字查询日志 # cat xxxxx.l ...

  5. var、let和const的区别详解

      let 和 const 是 ECMAScript6 新推出的特性,其中 let 是能够替代 var 的"标准",所以我们探讨 var.let 和 const 的区别,首先应该知 ...

  6. 汇编刷题:屏幕显示 HOW ARE YOU!

    DATA SEGMENT INFO DB 'HOW ARE YOU!$' DATA ENDS CODE SEGMENT ASSUME CS:CODE,DS:DATA START: MOV AX,DAT ...

  7. Flask 入门 (十一)

    上篇文章讲的是一对多,这篇文章应该说多对多了 但是多对多无法用两张表来实现,因为外键......,你懂,哈哈哈!,所以中间需要加一张表来实现 承接上文,修改main.py中的代码如下: #encodi ...

  8. TP3快速入门

    一.查询 D方法实例化模型类的时候通常是实例化某个具体的模型类,如果你仅仅是对数据表进行基本的CURD操作的话,使用M方法实例化的话,由于不需要加载具体的模型类,所以性能会更高. $map = arr ...

  9. Erlang语言之简述及安装

    1. 简述 Erlang在1991年由爱立信公司向用户推出了第一个版本,经过不断的改进完善和发展,在1996年爱立信又为所有的Erlang用户提供了一个非常实用且稳定的OTP软件库并在1998年发布了 ...

  10. C#多线程系列(2):多线程锁lock和Monitor

    1,Lock lock 原型 lock 编写实例 2,Monitor 怎么用呢 解释一下 示例 设置获取锁的时效 C# 中,可以使用 lock 关键字和 Monitor 类来解决多线程锁定资源和死锁的 ...