上次写过如何上传文件，上传成功之后，会出现一些问题。

当我打开上传的文件，但是没有点击上传，然后关闭弹窗，接着继续上传刚才的那个文件。为了满足产品组的要求，我们一般都会把样式进行一定的覆盖。

但这就会出现一定的问题。按照上面说的那种情况，当我再次打开之后覆盖样式的内容为空。

其实刚开始是百思不得其解的，最后想了一下，应该是file文件内容没有清空的原因造成的。

上网查各种清空的方法。

普遍使用较多的就是外部加一个form表单，然后清空form表单里面的内容。

如上图一样，我给input标签外面增加一个form标签，id为videoForm

我们产品需求上传文件是在一个弹框里面的。

所以我每次打开弹框的时候，只需要清空一下该内容就行。

具体代码

document.getElementById('videoForm')&&document.getElementById('videoForm').reset();

第二种方法就是

每次提交成功之后的操作。

document.getElementById('').outerHtml = document.getElementById('').outerHtml

input type file上传文件之后清空内容。的更多相关文章

  1. input type=file 上传文件样式美化（转载）

    input type=file 上传文件样式美化 来源:https://www.jianshu.com/p/6390595e5a36 在做input文本上传时,由于html原生的上传按钮比较丑,需要对 ...

  2. HTML <input type="file">上传文件——结合asp.net的一个文件上传示例

    HTML的代码:(关键是要在form里设置enctype="multipart/form-data",这样才能在提交表单时,将文件以二进制流的形式传输到服务器) 一. <fo ...

  3. jquery判断 input type="file"上传文件是否为空

    要想获取type="file"的input内容,用var file = $("id").val();肯定是不行的,下面是代码: html上传按钮为: <i ...

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

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

  5. input type='file' 上传文件 判断图片的大小是否合格与witdh 和 height 是否合格

    function CheckFiles(obj) { var array = new Array('gif', 'jpeg', 'png', 'jpg'); //可以上传的文件类型 if (obj.v ...

  6. onclick事件触发 input type=“file” 上传文件

    添加按钮: <input type="button" name="button" value="浏览" onclick="j ...

  7. input[type=file]上传文件（格式判断、文件大小、上传成功后操作）

    var isUploadImg = false; //在input file内容改变的时候触发事件******************上传图片 $('#filed').change(function( ...

  8. 使用 input[type=file]上传文件

    var $file = $('#file'); $('#btn').click(function() { var data = new FormData(); data.append('file', ...

  9. input标签type="file"上传文件的css样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. 51nod——1285 山峰和分段（暴力出奇迹）

    要求每段的点数都一样,因此分的段数cnt肯定是n的因子,要求每段都有山峰,因此cnt肯定小于等于山峰数量.分段的宽度d=n/cnt,对山峰数量做一个前缀和,检查一下每一段的山峰数量是否没有增加即可. ...

  2. 1025: [SCOI2009]游戏

    Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 2727  Solved: 1794[Submit][Status][Discuss] Descripti ...

  3. JsRender (js模板引擎)

    最近学习了一下Jsrender模板渲染工具,非常不错,功能比较强大,官网说他是“简单直观 功能强大 可扩展的 快如闪电”确实如此.总结一下!! jsRender 三个最重要的概念:模板.容器和数据. ...

  4. java util - json转换工具 gson

    需要 gson-2.7.jar 包 package cn.java.gson; import com.google.gson.JsonElement; import com.google.gson.J ...

  5. JZOJ 5849 d

    Description Input Output Data Constraint 做法:考虑贪心使得mina*minb最大,先以a为关键字排序,然后枚举删除最小的0~m个ai,对应删除最小的bi,然后 ...

  6. 笔记1 python入门学习笔记

    目录 官方手册 菜鸟站手册地址: python的运行方法 注释 小技巧: input()接收用户输入的内容(默认为字符串) print() 运算符 is 是判断两个标识符是不是引用自一个对象 all和 ...

  7. requests模块高级

    requests模块高级 cookie cookie: 基于用户的用户数据 -需求:爬取用户的豆瓣网的个人页面数据 cookie作用:服务器端使用cookie来记录客户端的状态信息 实现流程: 1.执 ...

  8. dijkstra与他的优化！！！

    目录 SPFA已死,有事烧纸 Dijkstra 配对堆 引言 讲解 合并 修改 弹出堆顶pop 代码 结合! 1 2 @ SPFA已死,有事烧纸 其实我本人也是一个SPFA的忠诚用户,至少我的最少费用 ...

  9. python-PIL模块的使用

    PIL基本功能介绍 from PIL import Image from PIL import ImageEnhance img = Image.open(r'E:\img\f1.png') img. ...

  10. v-model 的修饰符

    1..trim 自动过滤输入内容最开始 和 最后的 空格,中间的会保留一个空格,多的会被过滤掉 2..lazy 一般情况下,在input的 v-model是一直在同步 输入的内容与显示的内容,不过再添 ...